我有一個帶有進度條的影像滑塊。 https://jsfiddle.net/vandanasrivastava/voe49n8r/1/ 滑塊自動旋轉。但問題是，第一張幻燈片滾動得太快了。我是 JavaScript 新手。任何幫助深表感謝。請檢查下面的 JS fiddle。
var currentIndex = 0;// store current pane index displayed
var ePanes = $('#slider .panel'), // store panes collection
time = 5000,
bar = $('.progress_bar');
function showPane(index){// generic showPane
// hide current pane
ePanes.eq(currentIndex).stop(true, true).fadeOut();
// set current index : check in panes collection length
currentIndex = index;
if(currentIndex < 0) currentIndex = ePanes.length-1;
else if(currentIndex >= ePanes.length) currentIndex = 0;
// display pane
ePanes.eq(currentIndex).stop(true, true).fadeIn();
// menu selection
$('.nav li').removeClass('current').eq(currentIndex).addClass('current');
}
// bind ul links
$('.nav li').click(function(ev){ showPane($(this).index());});
// bind previous & next links
$('.previous').click(function(){ showPane(currentIndex-1);});
$('.next').click(function(){ showPane(currentIndex 1);});
// apply start pane
showPane(0);
function run(){
bar.width(0);
showPane(currentIndex 1);
bar.animate({'width': " =400"}, time, run);
}
run();
uj5u.com熱心網友回復：
在第 24 行你正在開火showPane(0)，但是你showPane(currentIndex 1)在這些run函式之后運行。
另外，設定在第一行currentIndex = -1而不是 0。
所以基本上你運行它兩次。只需注釋掉showPane(0)，它應該可以作業。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/442734.html
標籤：javascript html jQuery 滑块
下一篇：在Dropdown中動態添加選項