/**
 * js简单模拟 marquee滚动（向左）
 * @param {Object} id 标识id
 * @param {Object} obj 滚动的div对象
 * @param {Object} tp 一个隐藏div，临时保存滚动层的数据
 * @param {Object} speed 滚动的速度，值越大越慢。
 */
function marquee(id,obj,tp,speed){
	this.id =  id;
	this.obj = obj;
	this.text = this.obj.innerHTML;
	this.mw = 690;
	this.speed = speed;
	this.isScoll = false;
	this.preLeft = 0;
	this.t = null;
	this.tObj = tp;
	
	this.init = function(){
		var pm = this;
		var tp = pm.tObj;
		var mq = pm.obj;
		tp.innerHTML = "";
        while (tp.offsetWidth < pm.mw) {
            tp.innerHTML += mq.innerHTML;
        }
        mq.innerHTML = pm.text + pm.text;
		mq.style.width = pm.mw + "px";
		mq.style.whiteSpace = "nowrap";
		mq.style.overflowX = "hidden";
        mq.style.overflowY = "visible";
		mq.style.height = "20px";
		mq.style.lineHeight = "20px";
		mq.scrollLeft = 0;
		pm.start();
	};
	
	this.start =  function(){
		var pm = this;
		pm.isScoll = true;
		pm.t = setInterval(function(){
			pm.scoll();
		},pm.speed); 
	};
	
	this.stop = function(){
		var p = this;
		p.isScoll = false;
		clearInterval(p.t);
	};
	
	this.scoll =  function(){
		var p = this;
		if(p.isScoll){
			p.preLeft = p.obj.scrollLeft;  
			p.obj.scrollLeft += 1;   
			
			if(p.preLeft==p.obj.scrollLeft){     
	    		p.obj.scrollLeft = p.tObj.offsetWidth-p.mw+1;     
				p.obj.scrollLeft += 1;
			} 
		}	
	};
}

//调用实例
function example(){
	var obj = document.getElementById("marquees");
	var tobj = document.getElementById("templayer");
	var m = new marquee("Maq",obj,tobj,60);
	m.init();
	document.getElementById("Maq").onmouseover = function(){ m.stop();  } 
	document.getElementById("Maq").onmouseout  = function(){ m.start(); } 
}

example();