Javascript垂直方向轮播


<style type="text/css">
.cls_container{font-weight:bold;width:100%;font-size:14px;height:40px;overflow:hidden;border-bottom: #98B670 1px dashed;margin-bottom: 10px;line-height:40px;}
.cls_container ul{list-style-type:none;margin:0;padding:0;}
.cls_container ul li{height:40px;line-height:40px;width:100%;float:left;display:inline;}
</style>

<div id="myscroll" class="cls_container">
					[list]
						[*]你有人生的财务报表么?
[*]学习是投资回报率最高的投资

				 	[/list]
				</div>





function $jq(element){
	if(arguments.length>1){
		for(var i=0,length=arguments.length,elements=[];i<length;i++){
			elements.push($jq(arguments[i]));
		}
		return elements;
	}
	if(typeof element=="string"){
		return document.getElementById(element);
	}else{
		return element;
	}
}

var Class={
	create:function(){
		return function(){
			this.initialize.apply(this,arguments);
		};
 	}
};

Function.prototype.bind=function(object){
	var method=this;
	return function(){
		method.apply(object,arguments);
	};
};

var Scroll=Class.create();

Scroll.prototype={
	initialize:function(element,height){
		this.element=$jq(element);
		this.element.innerHTML+=this.element.innerHTML;
		this.height=height;
		this.maxHeight=this.element.scrollHeight/2;
		this.counter=0;
		this.scroll();
		this.timer="";
		this.element.onmouseover=this.stop.bind(this);
		this.element.onmouseout=function(){this.timer=setTimeout(this.scroll.bind(this),1000);}.bind(this);
	},
	scroll:function(){
		if(this.element.scrollTop<this.maxHeight){
			this.element.scrollTop++;
			this.counter++;
		}else{
			this.element.scrollTop=0;
			this.counter=0;
		}
	  
		if(this.counter<this.height){
			this.timer=setTimeout(this.scroll.bind(this),30);
		}else{
			this.counter=0;
			this.timer=setTimeout(this.scroll.bind(this),3000);
		}
	},
	stop:function(){
		clearTimeout(this.timer);
	}
};

你可能感兴趣的:(JavaScript,html,prototype)