使用两个按钮(图像)滚动设置为溢出的DIV:隐藏; 用jQuery

maz*_*aze 5 css jquery scroll overflow

我有一个div容器:

.mask { 
    height: 157px;
    overflow: hidden;
}
Run Code Online (Sandbox Code Playgroud)

此容器内的内容超过157px.我有两个链接(图像),我想用它来向上或向下滚动容器内的内容:

<ul class="scroll">
<li><a href="#"><img src="img/text-down-icn.png" alt="scroll down" /></a></li>
<li><a href="#"><img src="img/text-up-icn.png" alt="scroll up" /></a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)

如何让这两个链接滚动容器内的内容?

非常感谢

===========================================

谢谢你的帮助.事实证明,使用scrollTo插件(http://plugins.jquery.com/project/ScrollTo)效果最佳.

$(document).ready(function(){ 
    $(".down").click(function () {
        $('.mask').scrollTo( '+=156px', 500 );;
    });

    $(".up").click(function () {
        $('.mask').scrollTo( '-=156px', 500 );;
    });
}); 
Run Code Online (Sandbox Code Playgroud)

Moh*_*lam 0

您可以查看这些示例以了解如何实现它或直接使用它们来完成任务:

1- HoverScroll jQuery 插件

2- jCarousel

3-平滑的 Div 滚动