Flexslider IMG在768px及以下設置為0x0

Question

我有一個flexslider，它可以很好地用於769px及更高的媒體查詢，但是，一旦視口達到768px寬，flexslider中的IMG就會在Chrome檢查器中顯示為0x0。 在檢查器中沒有將IMG設置為0x0的位置

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"> <ol class="slides"> <li class="slide clone"> <a href="#"> <div class="slide-content"> <div class="slide-overlay"> <h2 class="slide-heading" style="color: #ffffff"></h2> <p class="slide-text" style="color: #ffffff"></p> <div class="slide-button" style="display:none; visibility: hidden"><span class="btn" style="color: #ffffff"></span></div> </div> <span class="slide-image-wrapper"> <img class="slide-image" src="http://cdn6.bigcommerce.com/s-y4b1n34/product_images/theme_images/slide_2.jpg?t=1416519561" alt=""> </span> </div> </a> </li> <li class="slide"> <a href=""> <div class="slide-content"> <div class="slide-overlay"> <h2 class="slide-heading" style="color: #ffffff"></h2> <p class="slide-text" style="color: #ffffff"></p> <div class="slide-button" style="display:none; visibility: hidden"><span class="btn" style="color: #ffffff"></span> </div> </div> <span class="slide-image-wrapper"> <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"> <a href=""> <div class="slide-content"> <div class="slide-overlay"> <h2 class="slide-heading" style="color: #ffffff"></h2> <p class="slide-text" style="color: #ffffff"></p> <div class="slide-button" style="display:none; visibility: hidden"><span class="btn" style="color: #ffffff"></span></div> </div> <span class="slide-image-wrapper"> <img class="slide-image" src="http://cdn6.bigcommerce.com/s-y4b1n34/product_images/theme_images/slide_2.jpg?t=1416519561" alt=""> </span> </div> </a> </li> </ol> </div> </div> </div> </div> 

Answer 1

在active.css？t = 1416605492中

/* 768px */
@media screen and (max-width: 768px) {

    /* Hide */

    #HomeSlideShow,
    #ProductBreadcrumb,
    .productlist-page .Left {
        display: none;
    }

#HomeSlideShow設置為不可見從此部分中刪除#HomeSlideShow