title: bxslider image too large when page first load
body: <p>I am using bxslider and when the slider loads the images insides loads in full size at the same time, which makes the website looks odd. There are about 5 images within the slider and when the page loads/refresh, they all appears in full size before resizing. </p>
  
  <p>the width has been set to 100% if I control the size width &amp; height in the below code things will not look right in mobile/tablet devices so the size needs to be adaptive to all screens.</p>
  
  <p>This is the code currently used:</p>
  
  <pre><code>.bx-wrapper {
      position: relative;
      margin: 0 auto 60px;
      padding: 0;
      *zoom: 1;
  }
  .bx-wrapper img {
      max-width: 100%;
         /* display: block; */
  }
  </code></pre>
  
  <p>I hope if anyone can help and stop the images from over scaling when page loads and keeping in mind all screen sizes.</p>
  
  <p>Thanks</p>