图像循环,setInterval和鼠标悬停

时间:2011-10-10 20:59:29

标签: javascript jquery image setinterval

我的脚本循环显示有问题。

鼠标指针在图像上移动后,我想暂停脚本(InfinityLoop)。 当鼠标离开图像时,脚本应该继续。

我几天都在努力,但没有让它运行: - /

感谢您的大力帮助!

var j = jQuery.noConflict();

jQuery(document).ready(function()
{
    /* stage functions */
    j("#small img").mouseover(function()
    {
        stageReset();
        var imageurl = j(this).attr("src");
        var aimage = imageurl.replace(".jpg", "_a.jpg");
        var bimage = imageurl.replace(".jpg", "_b.jpg");
        j(this).attr("src", aimage);
        j("#big img").attr("src", bimage);
    });

    j("#small img").mouseout(function()
    {
        var imageurl = j(this).attr("src");
        var aimage = imageurl.replace("_a.jpg", ".jpg");
        j(this).attr("src",aimage);
    });

    function stageReset()
    {
        j("#small img").each(function()
        {
            var reseturl = j(this).attr("src");
            reseturl = reseturl.replace("_a.jpg", ".jpg");
            j(this).attr("src", reseturl);
        });
    }
}

jQuery.fn.stageCycle = function()
    {
    var itemInterval = 2000;
    var numberOfItems = j("#small img").length;
    var currentItem = 0;

    var InfinityLoop = setInterval(function()
        {
        var url = j("#small img").eq(currentItem).attr("src");
        var urla = url.replace(".jpg","_a.jpg");
        var urlb = url.replace(".jpg","_b.jpg");

        stageReset();

        j("#small img").eq(currentItem).attr("src",urla);
        j("#big img").attr("src",urlb);


        if(currentItem == numberOfItems-1)
            {
            currentItem = 0;
            }
        else
            {
            currentItem++;
            }

        }, itemInterval);
    };

j(window).stageCycle();

});

0 个答案:

没有答案