0

今天我做了一个滑块,它的代码如下:

$(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

4

2 回答 2

0

*强文本*您几乎使用 kontrolka 就可以了,但后来您使用 cur 进行控制。

将 cur 初始化为 -1。

所以,无论你在哪里

cur=1

应该是

cur=-1

它适用于jsfiddle!

然后:而不是

$('#slider ul').animate({left: "-" + (cur*width) + "px"},"linear");

利用

$('#slider ul').animate({left: "-" + ((cur+2)*width) + "px"},"linear");

并且 kontrolka 应该始终是 cur+1。所以你甚至可以省略它。

于 2012-11-15T20:52:38.923 回答
0

在上一张幻灯片中,将 var curl 设置为 -1。

if(cur == slides){
     $('#slider ul').animate({left: "0px"},"linear");  
     cur=-1; ==>>> 
     kontrolka=1;
}
于 2012-11-15T20:57:01.230 回答