jquery 滚动插件

// 滚动插件
(function($) {

	$.fn.extend({
		Scroll: function(opt, callback) {

			// params init
			if (!opt) var opt = {};

			var objUp = opt.up ? $("#" + opt.up) : $("#btn1"),
				objDown = opt.down ? $("#" + opt.down) : $("#btn2");

			var timeId;

			var that = this.eq(0).find("ul:first");
				 // get line height
			var lineH = that.find("li:first").height(),
				 // get scroll line num, default one screen, namely parent's container height
				line = opt.line ? parseInt(opt.line, 10) : parseInt(this.height()/lineH, 10),
				// get scroll speed, default 500ms
				speed = opt.speed ? parseInt(opt.speed, 10) : 500,
				// get scroll time interval
				timer = opt.timer ? parseInt(opt.timer, 10) : 3000;
			if (!line) line = 1;
			var upHeight = 0 - line * lineH;
			// scroll up func
			var scrollUp = function() {
				// unbind up scroll func
				objUp.unbind('click', scrollUp);
				that.animate({
					marginTop: upHeight
				}, speed, function() {
					for(i=1;i<=line;i++){
						that.css({marginTop: 0}).find("li:first").appendTo(that);
					}
					// bind up scroll func
					objUp.bind('click', scrollUp);
				});
			}
			// scroll down func
			var scrollDown = function() {
				// unbind down scroll func
				objDown.unbind('click', scrollDown);
				for(i=1;i<=line;i++){
					that.css({marginTop: upHeight}).find("li:first").appendTo(that);
				}
				that.animate({
					marginTop: 0
				}, speed, function() {
					// bind down scroll func
					objDown.bind('click', scrollDown);
				});
			}
			// bind mouse event
			// auto play
			var autoPlay = function() {
				if (timer) timeId = setInterval(scrollDown, timer);
			}
			var autoStop = function() {
				if (timer) clearInterval(timeId);
			}
			that.hover(autoStop, autoPlay).mouseout();
			// bind up and down event
			objUp.css("cursor", "pointer").click(scrollUp).hover(autoStop, autoPlay);
			objDown.css("cursor", "pointer").click(scrollDown).hover(autoStop, autoPlay);
		}
	});

})(jQuery);

<div class="scrollDiv" id="s1">
		<ul>
			<li><a href="#">jquery 滚动条 Scrollbar 设置浏览器默认滚动条样式</a></li>
			<li><a href="#">jquery 图片切换 switchable 带左右按钮控制分页索引图片切换</a></li>
			<li><a href="#">jquery powerFloat万能浮动框提示插件 支持图片、文字、ajax异步加载、表单验证等</a></li>
			<li><a href="#">jquery 弹出层插件 ThickBox 多功能弹出层插件支持图片、ajax、内嵌内容弹等</a></li>
			<li><a href="#">jquery 表单美化 jquery tzCheckbox 复选框美化 自定义默认复选框</a></li>
			<li><a href="#">jquery HTML5 幻灯片插件 用 Canvas 制作类似百叶窗拍摄快门摄影拍摄效果</a></li>
			<li><a href="#">jquery 图片放大镜 图片类似放大镜效果鼠标滑过小图异步加载中图、大图</a></li>
			<li><a href="#">jquery 图片幻灯片 点击小图显示大图异步加载 支持按钮播放</a></li>
		</ul>
	</div>

<span id="btn1" >点击向上滚动</span>  <span id="btn2">点击向下滚动</span>

function AutoScroll(obj) {
	$obj = $(obj);
	$obj.find("ul:first").animate({
		marginTop: -25
	}, 500, function() {
		$(this).css({marginTop: 0}).find("li:first").appendTo(this);
	});
}
$(function() {
	setInterval('AutoScroll("#s1")', 2000);
	$("#s1").Scroll({line: 1, speed: 500, timer: 2000});
	$("#s1").Scroll({line:4,speed:500,timer:2000,up:"btn1",down:"btn2"});
});