jQuery的畫廊與Ajax加載的圖像在後臺？

是否有任何jQuery庫或插件能夠在後臺加載外部圖像並顯示加載gif的預覽？jQuery的畫廊與Ajax加載的圖像在後臺？

它還應該支持用於查看比當前分辨率大得多的圖像的滾動條。

2012-06-24 KJW

背景圖像是什麼？ – muthu

我之前使用過jQuery Cycle Plugin。它支持預覽加載圖片並預加載圖片。它有很多不錯的功能。我不確定你是否可以控制高度/ witdh，但我認爲如果你把一個CSS溢出屬性的周圍股利。

例如使用一些小的修改，基本演示，你可以找到關於 http://jquery.malsup.com/cycle/basic.html

在這種情況下，它是唯一的CSS樣式我已經改變了:-)

<!DOCTYPE html> 
<html> 
<head> 
    <title>JQuery Cycle Plugin - Basic Demo</title> 
    <style type="text/css"> 
     .slideshow { height: 160px; width: 160px; margin: auto; overflow: auto } 
     .slideshow img { } 
    </style> 
    <!-- include jQuery library --> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
    <!-- include Cycle plugin --> 
    <script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('.slideshow').cycle({ 
       fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc... 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <div class="slideshow"> 
     <img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" /> 
     <img src="http://cloud.github.com/downloads/malsup/cycle/beach2.jpg" width="200" height="200" /> 
     <img src="http://cloud.github.com/downloads/malsup/cycle/beach3.jpg" width="200" height="200" /> 
     <img src="http://cloud.github.com/downloads/malsup/cycle/beach4.jpg" width="200" height="200" /> 
     <img src="http://cloud.github.com/downloads/malsup/cycle/beach5.jpg" width="200" height="200" /> 
    </div> 
</body> 
</html>

查看更多在他們的主頁上： http://jquery.malsup.com/cycle/

來源

2012-06-24 20:36:36 Jedi

jQuery的畫廊與Ajax加載的圖像在後臺？

回答

相關問題