首页 > 代码库 > 滚动浏览
滚动浏览
今天下午做了一个滚动浏览效果,贴在此,积累
$(function(){
/*
* 滚动浏览
*/
$.fn.autoScroll = function(o){
o = $.extend({
speed: 20,
step : 1,
up : null,
down : null
}, o || {});
var wrap = $(this)[0],
u1 = $(this).children("ul:first")[0],
u2 = $(this).children("ul:last")[0],
timer = null,
scrollup = null,
oldSetp = o.step;
var scrolldown = function(){
if(u1.offsetHeight-wrap.scrollTop<=0)
wrap.scrollTop-=u1.offsetHeight;
else{
wrap.scrollTop += o.step;
}
};
var sup = function(){
var mid = u2;
u1 = u2; u2 = mid;
wrap.scrollTop = $(u1).height();
return function(){
$("#test").html(wrap.scrollTop);
if(wrap.scrollTop<=0)
wrap.scrollTop = $(u1).height();
else{
wrap.scrollTop -= o.step;
}
}
};
o.up.bind("mousedown",function(){
o.step = 8;
}).bind("mouseup",function(){
o.step = oldSetp;
});
o.down.bind("mousedown",function(){
if(typeof scrollup != ‘function‘) { scrollup = sup(); sup = null; }
o.step = 8;
clearInterval(timer);
timer = setInterval(scrollup,o.speed);
}).bind("mouseup",function(){
o.step = oldSetp;
clearInterval(timer);
timer = setInterval(scrolldown,o.speed);
});
var timer = setInterval(scrolldown,o.speed);
wrap.onmouseover = function(){clearInterval(timer);};
wrap.onmouseout = function(){timer = setInterval(scrolldown,o.speed);};
};
var reOrder = $("#recentOrder");
$(".reorder",reOrder).autoScroll({up:$("#reUp"),down:$("#reDown")});
})