我正在尝试滚动水平的Bootstrap选项卡,但是,滚动条一直到选项卡列表的末尾,使某些选项卡甚至不可见。那么,有没有一种方法可以逐步滚动选项卡,直到到达特定点? (然后滚动到末尾就可以了)。

我已经在这个主题上搜索了很多,所有示例似乎都在选项卡列表的末尾。

jsFiddle:https://jsfiddle.net/82c4ged0/



$('.scroller-right').click(function() {

  $('.scroller-left').fadeIn('slow');
  $('.scroller-right').fadeOut('slow');

  $('.list').animate({left:"+="+widthOfHidden()+"px"},'slow',function(){
  });
});

$('.scroller-left').click(function() {

  $('.scroller-right').fadeIn('slow');
  $('.scroller-left').fadeOut('slow');

    $('.list').animate({left:"-="+getLeftPosi()+"px"},'slow',function(){
    });
});





在小提琴中,窗口小得多,更清楚地看到滚动条如何直接进入列表中的最后一个选项卡

最佳答案

当前设置的方式,您将获得使用此变量/功能滚动的数量。

var widthOfHidden = function(){ return (($('.wrapper').outerWidth())-widthOfList()-getLeftPosi());};

您需要计算每次点击移动多少像素。它大约为-220像素,您可以手动输入以进行尝试。您可以像下面这样手动将其放入,并查看事情的表现是否接近您希望的样子。

var widthOfHidden = function(){ return -224;};

09-10 11:37
查看更多