Question

在我们开始之前，我对Javascript的理解并不是很了解。

我已成功使用Mootools 1.1滚动到元素onclick事件。我在这里使用FX.Scroll作为示例http://demos111.mootools.net/Fx.Scroll并且基本上扯掉了演示代码。

注意：如果您点击一个链接然后快速点击另一个链接，它会立即停止移动到第一个元素并滚动到第二个元素。

我现在正在尝试使用Mootools 1.3来使用图库的淡入淡出效果并使用More Builder来获取FX.Scroll。当我点击一个链接然后直接点击另一个链接时它正在工作但它继续第一个滚动。

似乎event.stop无效。

参见示例http://www.mytimephotography.co.uk＆lt;作品 http://www.mytimephotography.co.uk/test＆lt;破

我正在使用代码：

window.addEvent('domready', function () {
  var scroll = new Fx.Scroll('scrollcontainer', {
    wait: false,
    duration: 2000,
    offset: {'x': 0, 'y': 0},
    transition: Fx.Transitions.Quad.easeInOut
  })
  $('link1').addEvent ('click', function(event){
    event = new Event(event).stop();
    scroll.toElement('c1');
  })
  //etc
})

请查看网站上的任何其他源代码。

Answer 1

使用Fx选项对象的“link”属性。默认设置为“忽略”，这就是原始动画继续运行的原因。相反，如果您希望它在当前动画之后运行，请使用“chain”;如果您希望它中断当前正在运行的动画，请使用“cancel”。

或者，使用更快的动画 - 两秒真的长！：）

var scroll = new Fx.Scroll('scrollcontainer', {
    wait: false,
    duration: 2000,
    offset: {'x': 0, 'y': 0},
    transition: Fx.Transitions.Quad.easeInOut,
    link: 'cancel'
});

Mootools - 当另一个事件被触发时，FX.Scroll不会停止

1 个答案: