У меня есть flexslider, который отлично работает при медиа-запросах 769px и выше, однако, как только область просмотра достигает ширины 768 пикселей, IMG внутри flexslider появляется в инспекторе Chrome как 0x0. Нет, где в инспекторе является IMG быть установлен в 0x0Flexslider IMG установлен на 0x0 при 768px и ниже
http://70e-solutions.mybigcommerce.com/
Вот полный код называют:
<div id="ibSlideShow">
<div class="inner">
<div class="Content Widest" id="LayoutColumn1">
<script type="text/javascript" src="javascript/jquery/plugins/jquery.flexslider.js"></script>
<script type="text/javascript">
$(window).load(function() {
$('.slide-show').flexslider({
slideshowSpeed: $('.slide-show').attr('data-swap-frequency') * 1000,
animation: "slide",
pauseOnHover: true,
controlNav: true,
directionNav: true
});
});
</script>
<div class="slide-show slide-show-render slide-show-render-full flexslider Panel" data-swap-frequency="1000" id="HomeSlideShow">
\t <ol class="slides">
<li class="slide clone">
<a href="#">
<div class="slide-content">
\t \t \t \t <div class="slide-overlay">
\t \t \t \t \t <h2 class="slide-heading" style="color: #ffffff"></h2>
\t \t \t \t \t <p class="slide-text" style="color: #ffffff"></p>
\t \t \t \t \t <div class="slide-button" style="display:none; visibility: hidden"><span class="btn" style="color: #ffffff"></span></div>
\t \t \t \t </div>
\t \t \t \t <span class="slide-image-wrapper">
\t \t \t \t \t <img class="slide-image" src="http://cdn6.bigcommerce.com/s-y4b1n34/product_images/theme_images/slide_2.jpg?t=1416519561" alt="">
\t \t \t \t </span>
\t \t </div>
\t </a>
</li>
\t \t <li class="slide">
<a href="">
<div class="slide-content">
\t \t \t \t <div class="slide-overlay">
\t \t \t \t \t <h2 class="slide-heading" style="color: #ffffff"></h2>
\t \t \t \t \t <p class="slide-text" style="color: #ffffff"></p>
\t \t \t \t \t <div class="slide-button" style="display:none; visibility: hidden"><span class="btn" style="color: #ffffff"></span>
</div>
\t \t \t \t </div>
\t \t \t \t <span class="slide-image-wrapper">
\t \t \t \t \t <img class="slide-image" src="http://cdn6.bigcommerce.com/s-y4b1n34/product_images/theme_images/slide_1.jpg?t=1416519561" alt="">
</span>
</div>
</a>
</li>
<li class="slide">
\t \t \t \t <a href="">
\t \t \t \t \t <div class="slide-content">
\t \t \t \t \t \t \t <div class="slide-overlay">
\t \t \t \t \t \t \t \t <h2 class="slide-heading" style="color: #ffffff"></h2>
\t \t \t \t \t \t \t \t <p class="slide-text" style="color: #ffffff"></p>
\t \t \t \t \t \t \t \t <div class="slide-button" style="display:none; visibility: hidden"><span class="btn" style="color: #ffffff"></span></div>
\t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t <span class="slide-image-wrapper">
\t \t \t \t \t \t \t \t <img class="slide-image" src="http://cdn6.bigcommerce.com/s-y4b1n34/product_images/theme_images/slide_2.jpg?t=1416519561" alt="">
\t \t \t \t \t \t \t </span>
\t \t \t \t \t </div>
\t \t \t \t </a>
\t \t \t </li>
\t \t </ol>
</div>
</div>
</div>
</div>