當滑塊中沒有更多幻燈片時，使'下一個'或'上一個'按鈕淡出/消失

嘗試了許多預製滑塊後，其中沒有一個完全按照我想要的或與其他代碼衝突的方式工作，決定嘗試自己製作一個。當滑塊中沒有更多幻燈片時，使'下一個'或'上一個'按鈕淡出/消失

使用這個例子作爲基礎，http://rafbm.github.io/howtomakeaslider/

一切工作正常，但有一個選項，我想補充一點，我在另一個滑塊發現，http://webbies.dk/SudoSlider/

當你已經達到了最後一張幻燈片中的下'按鈕消失，讓人們知道之後沒有更多的幻燈片。（在加載第一張幻燈片時同樣適用 - >之前的按鈕已經淡出/消失，因爲之前沒有幻燈片）。

這是一個應用，在SudoSlider的HTML代碼：

<script type="text/javascript" > 
    $(document).ready(function(){ 
     var sudoSlider = $("#slider").sudoSlider({ 
      customLink:'a.customLink', 
      prevNext:false 
     }); 
    }); 
</script>

我如何可以添加到基礎的例子，我現在使用？

非常感謝你的時間。

來源

2013-08-20 user2699534

Withou more of your code we're gonna be stuck！嘗試讓jsfiddle向我們展示。 –

爲什麼不在他們的網站上查看sudo滑塊的來源？ –

我似乎無法編輯我的orignal文章（太多的鏈接），所以在這裏它是在一條評論：在這裏的基本示例代碼的小提琴：http://jsfiddle.net/4DYKy/ 但我認爲我擰了因爲它不工作而在某個地方上升？這是示例代碼的直接副本，所以它應該正常工作？ – user2699534

變化

goTo: function(index) { 
// filter invalid indices 
if (index < 0 || index > this.li.length - 1) 
return 

// move <ul> left 
this.ul.style.left = '-' + (100 * index) + '%' 

this.currentIndex = index 
},

到

goTo: function(index) { 
// filter invalid indices 
if (index < 0){ 
    $('#your_left_button').hide(); 
    return 
}else{ 
    $('#your_left_button').show(); 
} 


if(index > this.li.length - 1){ 
    $('#your_right_button').hide(); 
    return 
}else{ 
    $('#your_right_button').show(); 
} 

// move <ul> left 
this.ul.style.left = '-' + (100 * index) + '%' 

this.currentIndex = index 
},

基本上會隱藏自己的導航元素，當你到各自的目的。

來源

2013-08-20 11:23:39 DGS

非常感謝！ – user2699534

請記住接受正確的答案，以便人們知道你找到了你要找的東西 – DGS

當滑塊中沒有更多幻燈片時，使'下一個'或'上一個'按鈕淡出/消失

回答

相關問題