jQuery圖像滑塊？

過去幾天我們一直在努力創造一個圖像滑塊。jQuery圖像滑塊？

基本上，我們想要的是圖像的列表，例如：

<ul id="images"> 
<li id="1">http://www.site.com/image1.jpg</li> 
<li id="2">http://www.site.com/image2.jpg</li> 
<li id="3">http://www.site.com/image3.jpg</li> 
<li id="4">http://www.site.com/image4.jpg</li> 
<li id="5">http://www.site.com/image5.jpg</li> 
</ul> 

<div id="imageshow"> photo X of TOTAL </div> 

<a id="prev">previous</a> 
<a id="next">next</a>

所以基本上UL的內容是圖像的陣列中，imageshow DIV將內容區域在當前選定的圖像將顯示，並且前一個和下一個鏈接在圖像中滾動。

我們只想一次選擇一張圖像，圖像可以通過上一個和下一個鏈接進行更改。

我們在互聯網上發現了類似於此的腳本，但它們帶有其他我們不需要的功能，並且它們只是停留在頁面上。我們還需要該腳本在頁面上多次使用，因爲此頁面將包含2,3,4甚至更多此功能，所以如果明白我的意思，這個圖像滾動器將需要爲每個頁面工作。

我們該如何去做這件事？因此，我們可以模仿的東西，看起來像下面的圖片：

http://i53.tinypic.com/21b18pe.jpg

謝謝:)

來源

2011-04-27 Latox

我假設他想要在一個頁面上加載不同畫廊的多個實例，並且大多數畫廊都要求將該數組加載到頁面上，所以json也許是更清潔的方法。從ajax請求中解僱。只是一個猜測 – 422 2011-04-27 02:48:56

退房：http://www.no-margin-for-errors.com/projects/prettyGallery/

來源

2011-04-27 02:46:53 422

怎麼樣像這樣（未經）：

<script> 
var imageArray=Array("image1.jpg","image2.jpg","image3.jpg","image4.jpg","image5.jpg"); 
var spot=0; 
document.getElementById('imageshow').innerHTML="<img src=\""+imageArray(spot)+"\"/><br/>Photo "+(spot+1)+" of "+imageArray.length; 

function nextpic(){ 
spot++; 
if((spot+1)==imageArray.length){spot=0;} 
document.getElementById('imageshow').innerHTML="<img src=\""+imageArray(spot)+"\"/><br/>Photo "+(spot+1)+" of "+imageArray.length; 
} 

function prepic(){ 
spot--; 
if((spot<0){spot=imageArray.length;} 
document.getElementById('imageshow').innerHTML="<img src=\""+imageArray(spot)+"\"/><br/>Photo "+(spot+1)+" of "+imageArray.length"; 
} 
</script> 
<div id="imageshow"></div> 

<a id="prev" onclick="prepic()">previous</a> 
<a id="next" onclick="nextpic()">next</a>

來源

2011-04-27 02:48:30

jQuery圖像滑塊？

回答

相關問題