悬停时的Javascript滑块暂停功能

寻找一个小的帮助，这个滑块来与我购买的Magento模板

我试图在鼠标悬停时加一个暂停，在鼠标离开时加一个恢复，但我还不知道用JavaScript会把我的手弄得这么脏

希望朝着正确的方向推进

这是我正在使用的代码

function decorateSlideshow() {
var $$li = $$('#slideshow ul li');
if ($$li.length > 0) {

    // reset UL's width
    var ul = $$('#slideshow ul')[0];
    var w = 0;
    $$li.each(function(li) {
        w += li.getWidth();
    });
    ul.setStyle({'width':w+'px'});

    // private variables
    var previous = $$('#slideshow a.previous')[0];
    var next = $$('#slideshow a.next')[0];
    var num = 1;
    var width = ul.down().getWidth() * num;
    var slidePeriod = 3; // seconds
    var manualSliding = false;

    // next slide
    function nextSlide() {
        new Effect.Move(ul, { 
            x: -width,
            mode: 'relative',
            queue: 'end',
            duration: 1.0,
            //transition: Effect.Transitions.sinoidal,
            afterFinish: function() {
                for (var i = 0; i < num; i++)
                    ul.insert({ bottom: ul.down() });
                ul.setStyle('left:0');
            }
        });
    }

    // previous slide
    function previousSlide() {
        new Effect.Move(ul, { 
            x: width,
            mode: 'relative',
            queue: 'end',
            duration: 1.0,
            //transition: Effect.Transitions.sinoidal,
            beforeSetup: function() {
                for (var i = 0; i < num; i++)
                    ul.insert({ top: ul.down('li:last-child') });
                ul.setStyle({'position': 'relative', 'left': -width+'px'});
            }
        });
    }

    function startSliding() {
        sliding = true;
    }

    function stopSliding() {
        sliding = false;
    }

    // bind next button's onlick event
    next.observe('click', function(event) {
        Event.stop(event);
        manualSliding = true;
        nextSlide();
    });

    // bind previous button's onclick event
    previous.observe('click', function(event) {
        Event.stop(event);
        manualSliding = true;
        previousSlide();
    });


    // auto run slideshow
    new PeriodicalExecuter(function() {
        if (!manualSliding) nextSlide();
        manualSliding = false;
    }, slidePeriod);


}

然后添加一个if-like-so

function nextSlide() {
        if (!stopSliding) {
        new Effect.Move(ul, { 
            x: -width,
            mode: 'relative',
            queue: 'end',
            duration: 1.0,
            //transition: Effect.Transitions.sinoidal,
            afterFinish: function() {
                for (var i = 0; i < num; i++)
                    ul.insert({ bottom: ul.down() });
                ul.setStyle('left:0');
            }
        });
    }
}

    // previous slide
    function previousSlide() {
        if (!stopSliding) {
        new Effect.Move(ul, { 
            x: width,
            mode: 'relative',
            queue: 'end',
            duration: 1.0,
            //transition: Effect.Transitions.sinoidal,
            beforeSetup: function() {
                for (var i = 0; i < num; i++)
                    ul.insert({ top: ul.down('li:last-child') });
                ul.setStyle({'position': 'relative', 'left': -width+'px'});
            }
        });
    }
    }

这个方法有效，但现在只有Safari会自动启动我的幻灯片，firefox需要交互才能启动

然而，我确实发现，在Firefox而不是Safari中，在开始时将var切换为true，并在鼠标移动的顺序上切换，然后自动启动

---

今晚已经吃够了。

所以我设法让它在Firefox、Safari等浏览器中运行，使用：

Event.observe( window, 'load', function() { stopSliding = false; });

---

这确保设置了变量stopSliding。

是的，我在搜索observe时意识到JQuery标记为son的错误，所以我尝试了ul.observe'mouseover'，functionevent{Event.stopevent；}；//绑定上一个按钮的onclick事件ul。观察'mouseout'，functionevent{event.startevent；}；但是那里没有爱。如果您能在语法方面提供任何帮助，我们将不胜感激。我将对原型进行一点研究。是的，这对我来说是一个新的世界，谢谢您的提示！所以我几乎拥有了它。它可以在Firefox中使用，但不能在Safari中使用，所以上帝知道IE中发生了什么

ul.observe('mouseover', function(event) {
        stopSliding = true;

    });


    ul.observe('mouseout', function(event) {
        stopSliding = false;
    });

Event.observe( window, 'load', function() { stopSliding = false; });