需要在jQuery上使用滚动条和箭头同时滑动

Question

我需要在jQuery上同时使用滚动条和箭头的内容滑块.像这样的东西 ,但是像这样的两侧有箭头.箭头应出现在悬停父标签上.我在互联网上搜索.但我找不到我需要的东西.有人知道这样的滑块吗？

Answer 1

按下下一个/上一个按钮时,使用值方法将滑块的值设置为下一个/上一个页面.实现这一点需要大约10行JavaScript和jQuery和UI.

我是根据您提供的链接中的滑块开发的.JS代码就像这样,可以在这个小提琴中找到.

var max = , pageWidth = ; // see the fiddle for the full code
$('#prev, #next').click(function(){
    var current = $("#slider").slider('value');
    var to = $(this).is('#prev') ? current - pageWidth : current + pageWidth;
    $('#prev, #next').show();

    if(to <= 0)
        $('#prev').hide();
    else if(to >= max - pageWidth)
        $('#next').hide();

    $("#slider").slider('value', to);
    sliderOpts.slide(null, { value: to });
});
$('#prev').trigger('click'); // init????????

因此,唯一剩下的就是应用您喜欢的任何CSS更改,如果您想将#prev和#next按钮移动到父元素,使用提供的代码也可以.