ul,li { margin:0; padding:0; } #scrollDiv { width:300px; height:250px; min-height:25px; line-height:25px; border:#ccc 1px solid; overflow:hidden; } #scrollDiv li { height:25px; padding-left:10px; }
功能需求:
1、滚动框内显示10条记录;
2、有向上和向下滚动按钮,每次点击按钮向上或向下滚动记录条数,不自动滚动;
3、记录条数不循环滚动,滚动到起点或终点则停止滚动。
下面介绍一个简单实现方法:
1、外层容器(div) overflow: hidden,内层列表(ul)
2、按钮点击事件触发一个修改列表的函数
3、应用animate实现动画效果