加載圖像數組並加載下一張圖像，點擊

我試圖用x圖像構建一個漸進式滑塊。其含義是，在頁面加載時，滑塊在滑塊容器中加載3個圖像，無論該數組包含多少圖像。加載圖像數組並加載下一張圖像，點擊

點擊next/prev應該將前3張圖像滑動到任一側，然後加載下一個3（如果有的話）。

它應該發送下一個索引號到下一個功能，並在點擊時增加/減少。

這是否有意義？ :)這是一個快速的樣機，我做了...任何想法都歡迎：O）

THX !!!

var aImages = new Array("image1.jpg","image2.jpg","image3.jpg"); 
var slideImage = 1; 

function showImages() 
{ 
    var startImage = (slideImage -1)*6+1; 
    var endImage = (startImage +5); 

    for(i=startImage ; i <= endImage ; i++) 
    { 
     $('imageId'+ i).src = aImages[i]; 
     slideImage ++; 
    } 

} 

function slideImages() 
{   
    var startImage = (slideImage -1)*6+1; 
    var endImage = (startImage +5); 

    for(i=startImage ; i <= endImage ; i++) 
    { 
     $('imageId'+ i).src = aImages[i]; 
    } 
} 

slideImages();

來源

2013-02-08 Graahf

試試這個：http://www.codeproject.com/Articles/12218/Web-Based-Image-Slideshow-using-JavaScript – Pandian 2013-02-08 14:39:58

你可以使用庫嗎？ http://jquerytools.org/demos/scrollable/index.html滾動是非常容易使用。 – 2013-02-08 14:42:02

我會看看那些，thx :) – Graahf 2013-02-08 15:36:59

爲了有一個最佳的經驗，你應該至少預裝前3並在未來3個圖像

你也可以做類似

var imageList = []; 
for(...) 
{ 

    var img = new Image(); 
    img.src = ''; 
    imageList.push(img); 

}

，讓他們在高速緩存

並使用9個圖像佔位符（中央3加3到每邊），然後只應用

imgNode.src = imageList[x].src

來源

2013-02-08 14:40:03

不錯 - 我會嘗試thar和ser的世界爲我的:) – Graahf 2013-02-08 15:36:10

加載圖像數組並加載下一張圖像，點擊

回答

相關問題