javascript - 使用 JS/jQuery 滚动溢出的 div 内容 : scroll applied

Question

所以我有一个 div，里面有一堆比 div 更宽的内容。我已经设置了 overflow-x: scroll 并且一切正常。但是我想在我的页面上有两个链接，允许用户左右滚动 div 中的内容(模仿标准滚动条箭头功能)。这可能吗？

Answer 1

使用 jQuery 可以像这个例子一样处理滚动:

$(function(){
    var iv;
    var div = $('#content');
    $('#left').mousedown(function(){
        iv = setInterval(function(){
            div.scrollLeft( div.scrollLeft() - 4);
        },20);
    });
    $('#right').mousedown(function(){
        iv = setInterval(function(){
            div.scrollLeft( div.scrollLeft() + 4);
        },20);
    });
    $('#left,#right').on('mouseup mouseleave', function(){
        clearInterval(iv);
    });
});

JSFiddle:
http://jsfiddle.net/jdNa9/1/ (基本示例)
http://jsfiddle.net/jdNa9/3/ (有一点更新的 CSS)