jquery.marquee.js/跑马灯/图片滚动
2012-10-17 金城 5067
(function($){
$.fn.marquee = function(o){
var opts = $.extend({},$.fn.marquee.defaults,o);
return this.each(function(){
var $me=$(this);
var oS=$me.html();
var width=$me.width();
var height=$me.height();
$me.css('position','relative');
var hdl,Amount=opts.scrollAmount;
var $mar;
if(opts.direction=='left'||opts.direction=='right'){
$mar=$('<table style="position:relative;left:0;"border="0"cellspacing="0"cellpadding="0"><tr><td align="center"style="word-break:keep-all;white-space:nowrap;word-wrap:normal;">'+oS+'</td><td style="word-break:keep-all;white-space:nowrap;word-wrap:normal;">'+oS+'</td></tr></table>');
}else{
$mar=$('<table style="position:relative;top:0;"border="0"cellspacing="0"cellpadding="0"><tr><td align="center"style="word-break:keep-all;white-space:nowrap;word-wrap:normal;">'+oS+'</td></tr><tr><td style="word-break:keep-all;white-space:nowrap;word-wrap:normal;">'+oS+'</td></tr></table>');
}
$me.html($mar);
function _left(){
var left=parseInt($mar.css('left'));
left -=Amount;
if(left<-width)left=0;
$mar.css('left',left+'px');
};
function _right(){
var left=parseInt($mar.css('left'));
left +=Amount;
if(left>0)left=-width;
$mar.css('left',left+'px');
};
function _up(){
var top=parseInt($mar.css('top'));
top -=Amount;
if(top<-height)top=0;
$mar.css('top',top+'px');
};
function _down(){
var top=parseInt($mar.css('top'));
top +=Amount;
if(top>0)top=-height;
$mar.css('top',top+'px');
};
function _play(){
if(opts.direction=='left')hdl=setInterval(_left,opts.scrollDelay);
else if(opts.direction=='right')hdl=setInterval(_right,opts.scrollDelay);
else if(opts.direction=='up')hdl=setInterval(_up,opts.scrollDelay);
else if(opts.direction=='down')hdl=setInterval(_down,opts.scrollDelay);
};
function _set_direction(d){
clearInterval(hdl);
opts.direction=d;
_play();
};
$me.hover(function(){
clearInterval(hdl);
},_play);
if(opts.leftCtrl)
opts.leftCtrl.mousedown(function(){Amount=opts.newAmount;}).mouseup(function(){Amount=opts.scrollAmount;}).mouseover(function(){_set_direction('left')});
if(opts.rightCtrl)
opts.rightCtrl.mousedown(function(){Amount=opts.newAmount;}).mouseup(function(){Amount=opts.scrollAmount;}).mouseover(function(){_set_direction('right')});
if(opts.upCtrl)
opts.upCtrl.mousedown(function(){Amount=opts.newAmount;}).mouseup(function(){Amount=opts.scrollAmount;}).mouseover(function(){_set_direction('up')});
if(opts.downCtrl)
opts.downCtrl.mousedown(function(){Amount=opts.newAmount;}).mouseup(function(){Amount=opts.scrollAmount;}).mouseover(function(){_set_direction('down')});
_play();
});
};
$.fn.marquee.defaults={
direction:'left',
scrollAmount:1,
scrollDelay:100,
newAmount:10,
leftCtrl:null,
rightCtrl:null,
upCtrl:null,
downCtrl:null
}
$.fn.marquee.setDefaults=function(settings){
$.extend( $.fn.marquee.defaults,settings);
};
})(jQuery);
jquery.marquee.js下载
- 上一篇:心病还须心药医
- 下一篇:冰河世纪剑齿松鼠的原型