jQuery（插件）淡入淡出滑块

Question

我正在尝试构建一个 jQuery 滑块。

这将淡入和淡出“卡在”同一位置的图像。 （这个解释清楚吗）。

有点像这样：

http://d2o0t5hpnwv4c1.cloudfront.net/377_slider/slider_sourcefiles/slider.html

但没有水平移动。

您能否指出类似的东西，以便我可以根据自己的目的对其进行修改，但仍然不必重新发明轮子？

Answer 1

这样的？ http://jsfiddle.net/Ender/9zqbY/

使用 jQueryUI 滑块小部件，您应该能够很容易地实现这一点。我的演示远非完美，但它应该足以让你走上正轨。使用 jQueryUI 滑块，您可以将函数绑定到 slidechange 事件以淡入和淡出图像。这是该函数的示例：

$('#slider').bind("slidechange", function(event, ui) {
   var newIndex = $("#slider").slider("value");
   var oldIndex = $('#sliderContent .item').index('.shown');
   if (newIndex != oldIndex) {
       $('.shown').fadeOut().removeClass('shown');
       $('#sliderContent .item').eq(newIndex).fadeIn().addClass('shown');
   }
});

祝你好运！