javascript - Jquery slider : smooth click animation

Question

jquery slider 包含一个“动画”选项，当设置为“true”时，单击 slider 时会将 handle 滑动到位。

我使用 slider 滚动另一个 div 中的内容，创建与苹果网站上类似的效果。 http://www.apple.com/mac/

问题是，当我单击 slider 时，它会平滑地对 handle 进行动画处理，但不会对其他 div 进行动画处理。我让另一个 div 在“幻灯片”和“更改”事件上滚动。我有什么想法可以实现另一个 div 的平滑滚动吗？

预先感谢，jQuery 之神。

我的代码:

var list = $('.sliderGallery ul');

$('.slider').slider({
    min:0,
    max:1500,
    animate: true,
    slide: function(event, ui) { list.css('left', '-' + ui.value + 'px'); },
    change: function(event, ui) { list.css('left', '-' + ui.value + 'px'); }
});

Answer 1

自从我使用 JavaScript 以来已经有一段时间了，但据我记得 jQuery，你可以尝试做你已经在做的同样的事情，但使用动画效果。试试这个:

var list = $('.sliderGallery ul');

$('.slider').slider({
    min:0,
    max:1500,
    animate: true,
    slide: function(event, ui) { list.animate({'left': '-' + ui.value + 'px'}, 'normal'); },
    change: function(event, ui) { list.animate({'left': '-' + ui.value + 'px'}, 'normal'); }
});

这段代码可能不会立即工作，但希望它可以作为一个起点。以下是此函数文档的链接:animate( params, [duration], [easing], [callback] ) in Effects/animate .