今天我做了一个滑块,它的代码如下:
$(document).ready(function() {
//Tworzenie Kontrolek
var html = "<ol id=\"controls\">";
$('#slider ul li').each(function(i) {
html += "<a href=\"javascript:void(0);\"><li id=\"" + (i+1) + "\">" + (i+1) + "</li></a>";
});
html += "</ol>";
$('#slider').after(html);
//Koniec tworzenia kontrolek
//Ustawianie
var width = $('#slider').width();
var slides = $('#slider li').length;
$('#slider ul').css("width", "" + (width*slides) + "");
//Koniec ustawiania
//Animowanie Slide'ow
var cur = 1;
var kontrolka = -1;
var slider = setInterval(function() {
if(cur < slides){
$('#slider ul').animate({left: "-" + (cur*width) + "px"},"linear");
cur+=1;
kontrolka+=1;
}
if(cur == slides){
$('#slider ul').delay(3000).animate({left: "0px"},"linear");
cur=1;
kontrolka=0;
}
//Kontrolki
$('#controls li').removeClass("active");
$('#controls li:contains(' + kontrolka + ')').addClass("active");
//Koniec Kontrolek
}, 3000);
//Koniec Animowania Slidow
//Klikanie Kontrolek
$('#controls li').click(function() {
var clicked = $(this).attr('id');
$('#slider ul').animate({left: "-" + ((clicked-1)*width) + "px"},500,"linear");
clearInterval(slider);
});
//Koniec klikania Kontrolek
});
我有一些问题,因为它控制从 1 到 4 的计数离开 5 到 1 并且在这个 1 上是幻灯片编号 5 的图像,我真的不知道出了什么问题,有人可以帮助我吗?
PS对不起我的英语不好
好的 jsfiddle http://jsfiddle.net/Sck5w/看看导航是如何工作的:1 2 3 4 好 5 错过了,又一次 1