欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery實(shí)現(xiàn)圖片預(yù)加載效果

 更新時(shí)間:2015年11月27日 14:19:31   作者:愛上程序猿  
這篇文章分享一款基于jQuery圖片預(yù)加載ydxLazyLoad.js代碼。這是一款基于ydxLazyLoad.js插件實(shí)現(xiàn)的圖片延遲加載特效,感興趣的小伙伴們可以參考一下

本文實(shí)例講述了jQuery實(shí)現(xiàn)圖片預(yù)加載效果代碼。分享給大家供大家參考。具體如下:
運(yùn)行效果截圖如下:

具體代碼如下:

html代碼:

<div class="main">
 <br>
 <div class="title">圖片預(yù)加載</div>
 <div class="content">
  <div class="img">
  <a href="">
   <img lazyloadsrc="images/1.jpg" alt="" width="200" height="120">
  </a>
  <span class="loading"></span>
  </div>
  <div class="img">
  <a href="">
   <img lazyloadsrc="images/2.jpg" alt="" width="200" height="120">
  </a>
  <span class="loading"></span>
  </div>
  <div class="img">
  <a href="">
   <img lazyloadsrc="images/3.jpg" alt="" width="200" height="120">
  </a>
  <span class="loading"></span>
  </div>
  <div class="img">
  <a href="">
   <img lazyloadsrc="images/4.jpg" alt="" width="200" height="120">
  </a>
  <span class="loading"></span>
  </div>
  <div class="img">
  <a href="">
   <img lazyloadsrc="images/5.jpg" alt="" width="200" height="120">
  </a>
  <span class="loading"></span>
  </div>
  <div class="img">
  <a href="">
   <img lazyloadsrc="images/6.jpg" alt="" width="200" height="120">
  </a>
  <span class="loading"></span>
  </div>
 </div>
 </div>

js代碼:

 $(function () {
  $("[lazyLoadSrc]").YdxLazyLoad({
  onShow: function () {
   $(this).parent().next().hide()
  }
  });
 });

本文已被整理到了《jquery圖片加載方法匯總》 ,歡迎大家學(xué)習(xí)閱讀。

大家在加載圖片時(shí)就會看到這種效果,現(xiàn)在知道是實(shí)現(xiàn)的過程了吧,希望大家喜歡小編分享的jQuery實(shí)現(xiàn)圖片預(yù)加載效果。

相關(guān)文章

最新評論