2011-11-07 71 views
0

我有一個幻燈片庫,因此當你點擊一個縮略圖,它檢索縮略圖圖像參考,並顯示在主面板。添加導航控件使用JavaScript幻燈片畫廊只有

現在我已經添加導航控件,但我不知道怎樣徹底線它,這樣,如果你點擊下一步/以前它通過導航的縮略圖,並突出了一個你在。

代碼太長,粘貼在這裏,但這裏是小提琴:

http://jsfiddle.net/calebo/QuXYV/

PS:JavaScript的唯一,沒有jQuery的。

回答

1

我重新編寫了代碼並使其工作here。我會推薦重構你的代碼來清理它。我想說創建保存圖像的URL對象的數組和標題:

var objArray, obj; 
for(var i = 0 ....) { 
    obj = { 
     url : "http://foobar.com/foo.png", 
     caption : "Caption" 
    }; 
    objArray.push(obj); 
} 
// then index with 
var currObj = objArray[current]; // where 'current' is the variable you are using for state 

基本上我所做的是將一些代碼出來bindImage,進入一個名爲「設置」功能(你可能想重命名這個)。我還評論了你刪除錨的href的行。

+0

嗨約翰 你的jsfiddle的鏈接似乎被打破。 – calebo

+0

糟糕。不知道那裏發生了什麼。現在已經修復了。 –

+0

註釋掉頂部函數中的'remove anchor href'會打破縮略圖點擊功能。任何方式來避免這種情況? – calebo

0

我要給你滑塊的例子,你可以立足解決方案(或者甚至改變)時。

的例子(JSFiddle)是向左或向右移動<div>元素滑塊的,但你可以看到如何做的單擊事件的結合。

希望有所幫助。隨意提出後續問題。