0

我正在创建一个图像横幅，其中包含更改文本和图像的翻转链接。我需要做的是每 5 秒在 5 个图像中旋转一次，但是在鼠标悬停时它会暂停旋转并将您带到用户选择的图像。我的鼠标悬停代码是：

$("#main_nav li").mouseover( function() {
    $(".navigation_main, .main_info").each (function() {
        $(this).removeClass("on").addClass("off");
                                    });
    $("#"+$(this).attr("id")).removeClass("off").addClass("on");
    $("#"+$(this).attr("id")+"_images").removeClass("off").addClass("on");
    $("#"+$(this).attr("id")+"_text").removeClass("off").addClass("on");
    $("#"+$(this).attr("id")+"_a").removeClass("off").addClass("on");
                             });

任何关于让它旋转的帮助都会很棒。

非常感谢

4

1 回答 1

1

下面是 jQuery 的循环插件是如何做到的：

示例： http: //malsup.com/jquery/cycle/pagerHover.html

如果设置了暂停选项，则悬停增加一个名为 cyclePause 的变量，导致幻灯片不旋转：

if (opts.pause)
    $cont.hover(function(){this.cyclePause++;},function(){this.cyclePause--;});

稍后检查循环暂停。如果是，那么就没有进步。

case 'pause':
        cont.cyclePause = 1;
        return false;
    case 'resume':
        cont.cyclePause = 0;
        if (arg2 === true) { // resume now!
            options = $(cont).data('cycle.opts');
            if (!options) {
                log('options not found, can not resume');
                return false;
            }
            if (cont.cycleTimeout) {
                clearTimeout(cont.cycleTimeout);
                cont.cycleTimeout = 0;
            }
            go(options.elements, options, 1, 1);
        }
        return false;
于 2009-10-12T16:17:05.030 回答