胸毛仙人个人笔记

js无缝滚动

		            
		            <div id="con">
			            <ul id="scroll1">
			              <li style="margin-top: -10px;">hello,world0</li>
			              <li >hello,world1</li>
			              <li >hello,world2</li>
			              <li >hello,world3</li>
			              <li >hello,world4</li>
			              <li >hello,world5</li>
			              <li >hello,world6</li>
			              <li >hello,world7</li>
			              <li >hello,world8</li>
			              <li >hello,world9</li>
			            </ul>
			            <ul id="scroll2" >
			            </ul>
			        </div>
			        
		            //scrollTop 向上滚动数值
		            //offsetHeight 元素高度
		            //setInterval 按指定周期执行
		            //clearInterval 清除执行
		            var area = document.getElementById("con");
		            var scroll1 = document.getElementById('scroll1');
		            var scroll2 = document.getElementById('scroll2');
		            scroll2.innerHTML = scroll1.innerHTML;
		            function scrollUp(){
		                if(area.scrollTop >= scroll1.offsetHeight){
		                    area.scrollTop = 0;
		                }else{
		                    area.scrollTop++;
		                }
		            }

		            var time = 50;
		            var myScroll =  setInterval('scrollUp()',time);

		            area.onmouseover = function(){
		                clearInterval(myScroll);
		            }
		            area.onmouseout = function(){
		                myScroll =  setInterval('scrollUp()',time);
		            }
		            
		            

js 间歇性无缝滚动

		            	
	            		<div id="con">
				            <ul id="scroll1">
				              <li style="margin-top: -10px;">hello,world0</li>
				              <li >hello,world1</li>
				              <li >hello,world2</li>
				              <li >hello,world3</li>
				              <li >hello,world4</li>
				              <li >hello,world5</li>
				              <li >hello,world6</li>
				              <li >hello,world7</li>
				              <li >hello,world8</li>
				              <li >hello,world9</li>
				            </ul>
				            <ul id="scroll2" >
				            </ul>
				        </div>

				        //scrollTop 向上滚动数值
			            //offsetHeight 元素高度
			            //setInterval 按指定周期执行
			            //clearInterval 清除执行

			            var area = document.getElementById("con");
			            var iLiHeight = 20;
			            var time;
			            var speed = 50;
			            var delay = 2000;
			            area.innerHTML += area.innerHTML;
			            area.scrollTop = 0;

			            function startMove(){
			                area.scrollTop++;
			                time =  setInterval('scrollUp()',speed);
			            }
			            function scrollUp(){
			                if (area.scrollTop % iLiHeight == 0) {
			                    clearInterval(time);
			                    setTimeout("startMove()",delay);
			                }else{
			                    area.scrollTop++;
			                    if (area.scrollTop >= area.scrollHeight/2) {
			                        area.scrollTop=0;
			                    }
			                }
			            }
			            setTimeout("startMove()",delay);