title: BX slider images not loading properly
body: <pre><code>&lt;?php $x = $_GET['house_id']; ?&gt;
  &lt;?php include 'connection.php';?&gt;
  &lt;?php
  $queryz = "SELECT * FROM photos WHERE id = $x";
  $link = mysqli_query($conn, $queryz);
  $lattitude = "SELECT latitude FROM location WHERE id=$x";
  $lt = mysqli_query($conn,$lattitude) ;
  $longitude = "SELECT longitude FROM location WHERE id=$x";
  $lg = mysqli_query($conn,$longitude) ;
  ?&gt;
  
  &lt;?php
  
      include 'connection.php';
  
      // Create connection
  
  
      $queryz = "SELECT * FROM photos WHERE id = $x";
      $link = mysqli_query($conn, $queryz);
  
      $sql_1 = "SELECT * FROM house_info WHERE id = $x";
      $result_1 = mysqli_query($conn,$sql_1);
      $info = mysqli_fetch_array($result_1);
  
          $city=$info['city'];
          $type=$info['type'];
          $location=$info['location'];
          $landmark=$info['landmark'];
          $gender=$info['gender'];
          $address=$info['address'];
  ?&gt;
  
  &lt;!DOCTYPE html&gt;
  &lt;html lang="en-US"&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"/&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;script src="assets/js/jquery-2.1.0.min.js"&gt;&lt;/script&gt;
      &lt;!--&lt;link href="../../fonts/font-awesome.css" rel="stylesheet" type="text/css"&gt;--&gt;
      &lt;!--&lt;link href='http://fonts.googleapis.com/css?family=Roboto:700,400,300' rel='stylesheet' type='text/css'&gt;--&gt;
      &lt;!--&lt;link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"&gt;--&gt;
      &lt;!--&lt;link href="../../css/style.css" rel="stylesheet" type="text/css"&gt;--&gt;
          &lt;!-- bxSlider Javascript file --&gt;
      &lt;script src="assets/js/jquery.bxslider.min.js"&gt;&lt;/script&gt;
  
      &lt;!-- bxSlider CSS file --&gt;
      &lt;link href="assets/css/jquery.bxslider.css" rel="stylesheet" type="text/css" /&gt;
  
      &lt;style&gt;
          #map-simple { min-height: 240px; }
      &lt;/style&gt;
  
      &lt;title&gt;&lt;?php echo $location;?&gt;&lt;/title&gt;
  &lt;/head&gt;
  &lt;body class="external"&gt;
  
  &lt;div id="item-detail" class="content-container"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-md-8"&gt;
              &lt;div class="inner"&gt;
                  &lt;!--&lt;div class="items-switch"&gt;
                      &lt;a href="#" class=""&gt;&lt;img src="ourhousesassets/img/arrow-left.png"&gt;&lt;/a&gt;
                      &lt;a href="#" class=""&gt;&lt;img src="ourhousesassets/img/arrow-right.png"&gt;&lt;/a&gt;
                  &lt;/div&gt;--&gt;
                  &lt;article class="animate move_from_bottom_short"&gt;
                      &lt;div class="gallery"&gt;
                          &lt;div class="image"&gt;
                             &lt;ul class="bxslider"&gt;
  
                                  &lt;li&gt;&lt;img height='100%' width='100%' src="addhouse/images_upload/1_1.jpg"/&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;img height='100%' width='100%' src="addhouse/images_upload/1_2.jpg"/&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;img height='100%' width='100%' src="addhouse/images_upload/1_3.jpg"/&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;img height='100%' width='100%' src="addhouse/images_upload/1_4.jpg"/&gt;&lt;/li&gt;
  
                              &lt;/ul&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/article&gt;
                  &lt;article class="animate move_from_bottom_short"&gt;
                      &lt;h1&gt;&lt;?php echo $type;?&gt;BHK Flat, &lt;?php echo $location;?&gt;&lt;/h1&gt;
                      &lt;h2&gt;&lt;i class="fa fa-map-marker"&gt;&lt;/i&gt;Near &lt;?php echo $landmark;?&gt;&lt;/h2&gt;
                      &lt;figure class="price average-color"&gt;&lt;span&gt;&lt;?php echo $gender;?&gt;&lt;/span&gt;&lt;/figure&gt;
                      &lt;figure class="price average-color"&gt;&lt;span&gt;Availability: &lt;?php include './ourhousesassets/totalavailability.php';?&gt;&lt;/span&gt;&lt;/figure&gt;
                  &lt;/article&gt;
                  &lt;!--end Description--&gt;
                  &lt;article class="sidebar"&gt;
                      &lt;div class="person animate move_from_bottom_short"&gt;
                          &lt;div class="inner average-color"&gt;
                              &lt;!--&lt;figure class="person-image"&gt;
                                  &lt;img src="ourhousesassets/img/person-01.jpg" alt=""&gt;
                              &lt;/figure&gt;--&gt;
                              &lt;header&gt;Address&lt;/header&gt;
                              &lt;a&gt;&lt;?php echo $address;?&gt;&lt;/a&gt;&lt;br&gt;
                              &lt;a&gt;Near &lt;?php echo $landmark;?&gt;&lt;/a&gt;
                              &lt;hr&gt;
                              &lt;a href="#person-detail" class="link" data-toggle="collapse" aria-expanded="false" aria-controls="person-detail"&gt;&lt;b&gt;Check Rents/Availability&lt;/b&gt;&lt;/a&gt;
                          &lt;/div&gt;
  
                          &lt;?php include './ourhousesassets/getroomwiserent.php';?&gt;
  
                      &lt;/div&gt;
                      &lt;!--end .person--&gt;
                      &lt;div class="block animate move_from_bottom_short"&gt;
                          &lt;dl&gt;
                              &lt;dt&gt;Bedrooms&lt;/dt&gt;
                              &lt;dd&gt;&lt;?php echo $type;?&gt;&lt;/dd&gt;
                              &lt;dt&gt;Locality&lt;/dt&gt;
                              &lt;dd&gt;&lt;?php echo $location;?&gt;&lt;/dd&gt;
                              &lt;dt&gt;Gender&lt;/dt&gt;
                              &lt;dd&gt;&lt;?php echo $gender;?&gt;&lt;/dd&gt;
                          &lt;/dl&gt;
                      &lt;/div&gt;
                      &lt;div class="block animate move_from_bottom_short"&gt;
                          &lt;dl&gt;
                              &lt;h2&gt;Bills covered&lt;/h2&gt;&lt;hr class="one"&gt;
                              &lt;dt&gt;Electricity&lt;/dt&gt;
                              &lt;dd&gt;&lt;b&gt;&lt;font color="#3fe173"&gt;&amp;#10004;&lt;/font&gt;&lt;/b&gt;&lt;/dd&gt;
                              &lt;dt&gt;WiFi&lt;/dt&gt;
                              &lt;dd&gt;&lt;b&gt;&lt;font color="#3fe173"&gt;&amp;#10004;&lt;/font&gt;&lt;/b&gt;&lt;/dd&gt;
                              &lt;dt&gt;DTH&lt;/dt&gt;
                              &lt;dd&gt;&lt;b&gt;&lt;font color="#3fe173"&gt;&amp;#10004;&lt;/font&gt;&lt;/b&gt;&lt;/dd&gt;
                              &lt;dt&gt;Maintenance&lt;/dt&gt;
                              &lt;dd&gt;&lt;b&gt;&lt;font color="#3fe173"&gt;&amp;#10004;&lt;/font&gt;&lt;/b&gt;&lt;/dd&gt;
                              &lt;dt&gt;Gas Connection&lt;/dt&gt;
                              &lt;dd&gt;&lt;b&gt;&lt;font color="#3fe173"&gt;&amp;#10004;&lt;/font&gt;&lt;/b&gt;&lt;/dd&gt;
                          &lt;/dl&gt;
                      &lt;/div&gt;
                  &lt;/article&gt;
                  &lt;!--end Sidebar--&gt;
  
  
  &lt;?php include './ourhousesassets/getfurniturelist.php';?&gt;
  
  &lt;?php include './ourhousesassets/getapplianceslist.php';?&gt;
  
  &lt;?php include './ourhousesassets/getamenitieslist.php';?&gt;
  
  
                  &lt;article&gt;
                      &lt;h3&gt;Map&lt;/h3&gt;
                      &lt;div id="map-simple"&gt;&lt;/div&gt;
                  &lt;/article&gt;
  
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;!--end .col-md-8--&gt;
      &lt;/div&gt;
      &lt;!--end .row--&gt;
  &lt;/div&gt;
  
  &lt;!--end #item-detail--&gt;
  
  &lt;script type="text/javascript"&gt;
  $(document).ready(function(){
    $('.bxslider').bxSlider({
      adaptiveHeight: true,
      mode: 'fade'
  
    });
  });
  &lt;/script&gt;
  
  &lt;script&gt;
      var _latitude = &lt;?php while($latt = mysqli_fetch_array($lt)){echo $latt['latitude'];}?&gt;;
      var _longitude =  &lt;?php while($lng = mysqli_fetch_array($lg)){echo $lng['longitude'];}?&gt;;
      var draggableMarker = false;
      var scrollwheel = false;
      var element = document.querySelector('body');
  
      if( hasClass(element, 'external') ){
          var head = document.getElementsByTagName('head')[0];
          var script = document.createElement('script');
          script.type = 'text/javascript';
          script.src = "http://homigo.in/ourhousesassets/js/external.js";
          head.appendChild(script);
      }
      else {
          simpleMap(_latitude, _longitude,draggableMarker, scrollwheel);
          rating();
          averageColor( $('.content-container') );
      }
  
      function hasClass(element, cls) {
          return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') &gt; -1;
      }
  
  &lt;/script&gt;
  
  
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The code above uses bx slider to display four images and it's not working properly. The slides are loading, and navigating but the images are not of ful sizes. They're cropped within the div and has not smooth navigation. Please let know if any java script or any other file causing the hindrance for the slider from working properly. </p>