加速Nivo滑块

只是想知道是否有人可以帮助我解决以下问题。我在HOME页面上使用nivo-slider旋转3（大）图像;但是，当访问者第一次访问该页面时，所有3张图像在它们全部加载到滑块之前可以看到好的5秒。加速Nivo滑块

这是我使用的网站上的脚本：

<script type="text/javascript"> 
    $(window).load(function() { 
     $('#nivo-slider').nivoSlider({ 
      effect:'random', 
      slices:15, 
      animSpeed:500, 
      pauseTime:5000, 
      startSlide:0, 
      directionNav:true, 
      directionNavHide: false, 
      controlNav:true, 
      controlNavThumbs:false, 
      controlNavThumbsFromRel:false, 
      controlNavThumbsSearch: '.jpg', 
      controlNavThumbsReplace: '_thumb.jpg', 
      keyboardNav:true, 
      pauseOnHover:true, 
      manualAdvance:false, 
      captionOpacity:0.8, 
      beforeChange: function(){}, 
      afterChange: function(){}, 
      slideshowEnd: function(){} 
     }); 
    }); 
    </script>

然后，我有以下HTML加载图像：

<div id="slideshow"> 
       <div class="slide slide-wide bg1"> 
        <div class="containit ornament-left"> 
         <div class="image"> 
          <div class="thumb"> 
           <div id="nivo-slider"> 
           <a href="/service/"><img src="/images/slider/slide1.jpg" alt="" title="" /></a> 
           <a href="/service/"><img src="/images/slider/slide2.jpg" alt="" title="" /></a> 
           <a href="/service/"><img src="/images/slider/slide3.jpg" alt="" title=""/></a> 
           </div> 
          </div> 
         </div> 
        </div> 
       </div> 
     </div>

有谁知道如何用这个脚本提高图像加载速度，如果是的话，你可以帮我一下。由于

来源

2010-12-10 Bill Johnson

对不起，我的第一个答案是完全错误的，请尝试：

#slider { 
    position:relative; 
    width: 800px; //your image width 
    height: 583px; //your image height 
} 
#slider img { 
    position:absolute; 
    top:0px; 
    left:0px; 
}

您可以检查我的实现在这里： http://www.duopixel.com/portafolio/

来源

2010-12-10 13:34:46 Duopixel

嗨，尝试CSS加法;不过，我认为真正的问题是形象。只是看了一下，他们是123KB。你会推荐我压缩一下他们吗？我在.jpg，.js和.css上运行gzip – 2010-12-10 13:56:26

当第一次查看网站时，第一张图像加载到INDEX页面上仍然存在问题。任何人对我能做什么有什么想法：a）加速或b）为nivo-slider编码解决方案？ – 2010-12-10 17:31:01

添加display: none到#slider img.，将隐藏所有的图像，直到NivoSlider显示它们正常。

来源

2010-12-11 10:46:45

加速Nivo滑块

回答

相关问题