1

我将这个快速轮播放在一起，用于循环浏览包含图形和其他各种数据的不同 div。我想要一些指示您当前正在查看的“页面”或 div 的东西。

这是我目前正在遍历 div 的示例。 http://jsfiddle.net/d6nZP/64/

我的计划是让一行点具有活动或非活动状态，具体取决于行中指示的页面。但即使是基本的页面计数器也可以在这一点上工作。

任何帮助将不胜感激，谢谢！

4

3 回答 3

4

这是一个简单的轮播寻呼机，尽情享受吧 ;) http://jsfiddle.net/d6nZP/65/

于 2012-06-12T00:12:07.533 回答
2

创建了一些你可以使用的东西http://jsfiddle.net/BadBoyBill/8yHmy/

    $("div[id^=marquee]:gt(0)").hide();

    function startTimer(){
        i = setInterval(rotate, 2000);
        return i;
    }

    var intID = startTimer();

    function stopTimer(){
        clearInterval(intID);
    }

    function rotate(){
        reference = $("div[id^=marquee]:visible").hide().next("div[id^=marquee]");
        reference.length ? $(reference).fadeIn() : $("div[id^=marquee]:first").fadeIn() ;
        dot = $(".indicator-on[id^=indicator]").removeClass("indicator-on").next("a[id^=indicator]").addClass("indicator-on");
        dot.length ? $(dot).addClass("indicator-on") : $("a[id^=indicator]:first").addClass("indicator-on");
    }

    $("div[id^=marquee]").each(function(){
        $("#indicators").append("<a href='#' id='indicator' class='indicator'></a>");
        $(".indicator:first").addClass("indicator-on");
    });

    $("a[id^=indicator]").click(function(e){
        var index = $("a[id^=indicator]").index(this);
        //alert(index);
        $("div[id=marquee]").hide();
        $("div[id=marquee]").eq(index).show();
        $("a[id=indicator]").removeClass("indicator-on");
        $("a[id=indicator]").eq(index).addClass("indicator-on");
        stopTimer();
        intID = startTimer();
        e.preventDefault();
    });

    $("a[id=indicator], div[id=marquee]").mouseenter(function(){
        stopTimer();
        //alert("mouseenter");
    }).mouseleave(function(){
        stopTimer();
        intID = startTimer();
        //alert("mouseexit");
    });
于 2012-12-05T16:48:27.117 回答
1

最简单的方法是在内容 div 中放置一些内容作为计数器，即在第一个 div 中放置“1/3”，在下一个“2/3”中，等等。当然，这种方法, 的缺点是对变化反应不快。更好的选择是保留一个单独的变量来跟踪哪个元素是可见的，然后当单击“下一步”按钮时，变量会递增，然后运行检查以查看该索引是否存在。如果不是，则循环回到开头。当然，与上一个按钮相反。

于 2012-06-12T00:05:54.893 回答