jQuery循环函数和从头开始-翻转函数答案

【问题标题】：jQuery loop function and start from beginning - flip functionjQuery循环函数和从头开始-翻转函数
【发布时间】：2012-03-23 22:14:17
【问题描述】：

这里是代码：http://jsfiddle.net/VW8V5/1/

悬停时它应该开始循环，但循环结束时它只显示 img3 和 img4（将 img3 循环到 img4），它应该从头开始。悬停时它应该停在 img1。

【问题讨论】：

标签： jquery jquery-plugins

【解决方案1】：

这将循环浏览所有四个图像。当您停止将鼠标悬停以停止图像循环时，我不确定您要完成什么。

/* FOR PEOPLE LIST ITEMS */
$(".box a").hover(
    function () {
        var self = $(this);
        self.data("hover", true);
        function flip() {
            var top = self.closest(".box");
            var next = top.find(".current").next("img");
            if (!next.length) {
                next = top.find("img:first");
            }
            top.find("img").hide().removeClass("current");
            next.addClass("current").show().flip({
                direction:'tb',
                speed: 200,
                onEnd: function(){
                    if (self.data("hover")) {
                        setTimeout(flip,500);
                    } else {
                        top.find(".hidden").fadeOut("slow");
                        top.find(".active").fadeIn("slow");
                    }
                }
            })
        }
        flip();

    }, 
    function () {
        $(this).data("hover", false);
    }
);

这里的工作演示：http://jsfiddle.net/jfriend00/hQnXm/

【讨论】：

@Mercury - 我刚刚对其进行了更新，以便在您停止悬停时将原始的第一张图像放回原处。我稍微修改了 HTML 以使其正常工作（更改了一些类）。现在答案中有一个有效的演示链接。