超大型全屏滑塊API

http://buildinternet.com/project/supersized/超大型全屏滑塊API

我很難找出與此jquery插件一起使用的javascript。我想要做的就是將它與更多的js插件合併，即我的手風琴插件。最終目標是在同一個屏幕上使用相同的控件和不同的圖像，實際上有兩個Supersized運行實例。我知道，很難想象，但這是一個例子。

身體是全屏幕背景與超大，圖像是image1.jpg，它是黑色和白色。然後，我有一個更小的div，身體中央寬960px，帶有我想要的所有圖像的手風琴，但彩色。所以當你改變手風琴，你改變背景。所以當你在手風琴盒中有彩色的image1.jpg時，身體的背景是image1.jpg黑白。

所以我遇到了麻煩，因爲超大尺寸的js似乎只定義了prev和下一個縮略圖，而不是所有的縮略圖。所以理論上我必須弄清楚如何顯示所有縮略圖，然後弄清楚如何改變這些縮略圖的圖像，以便它仍然控制幻燈片轉換，但實際上並不是背景的縮略圖。這樣，我就可以將手風琴幻燈片設置爲這些縮略圖，而讓它們控制手風琴和背景。

我確定我現在很困惑，所以如果你有任何問題，就去問問。謝謝。

來源

2012-03-22 o_O

讓我們看看，如果我在點擊一個div或東西有你的問題的權利，

如果你正在尋找一種方式來更改背景圖片（使用超大型），然後有很多方法可以做到它。

下面的代碼可能會幫助你，它會在最後用'-bw'代替活動的幻燈片圖像名稱。

例如：點擊與類名一個div「點擊我」從「image.jpg的」背景圖像更改爲「圖像bw.jpg」

function changeBg() { 
    var $supersizedImg = $("#supersized .activeslide img"), 
     imgSrc = $supersizedImg.attr('src'); 
    imgSrcArray = imgSrc.split('/'); //split the image source by '/' 
    fullFileName = imgSrcArray[imgSrcArray.length - 1]; //get the file name 
    fileName = fullFileName.split('.'); //split that file name by '.' 
    fileName[0] = fileName[0] + '-bw'; //grab the first array element(which is filename without extension and add a '-bw' in the end) 
    fileName = fileName.join('.'); //join the new file name with its extension with a '.' 
    imgSrcArray[imgSrcArray.length - 1] = fileName; //add the new file name the the last element of imgSrcArray. 
    imgSrcArray = imgSrcArray.join('/'); //join the whole url by '/' 
    $supersizedImg.attr('src', imgSrcArray); //add the new url to the img src of supersized 
} 

$('.click-me').on('click', changeBg); //call changeBg function when a div is clicked

希望它幫助。

來源

2012-04-18 00:09:05 Varinder

超大型全屏滑塊API

回答

相關問題