WEB开发网
开发学院网页设计JavaScript js文本在一行内幻灯显示效果 阅读

js文本在一行内幻灯显示效果

 2009-06-30 05:23:00 来源:WEB开发网   
核心提示:文字用"|"隔开,具体使用方法: 程序代码<div id="marqueeBox"><div>人的头脑太复杂,时间过得久,有时候连自己也被自己骗了,记下来才是最真实的......|最上等的控制是知道何时放手!</div></div>

文字用"|"隔开,具体使用方法:


 程序代码
<div id="marqueeBox"><div>人的头脑太复杂,时间过得久,有时候连自己也被自己骗了,记下来才是最真实的......|最上等的控制是知道何时放手!</div></div>

<script type="text/javascript" src="TextSlide.js"></script>
<script type="text/Javascript">
var Mar = new TextSlide("marqueeBox",4000,17);
Mar.init();
</script>


函数解释:


 引用内容
TextSlide(Objid,Delay,hg,flag)

Objid:要幻灯显示的对象ID;

Delay:切换延迟时间;

hg:显示高度;

flag:可选,显示类型:滚动和淡出两种,默认是滚动;


TextSlide.js代码如下:
 程序代码
//建立者:QQ:4641856 MSN:yourlips@hotmail.com  
//功能:文字幻灯切换,flag可选,默认是滚动。  
 
function TextSlide(Objid,Delay,hg,flag) {  
   var marqueeObj=document.getElementById(Objid);  
   var marqueeId=0;  
   var Opacity=0;//透明度  
   var Delay; //轮换延迟时间  
   var hg;//滚动延时http://bizhi.cncms.com/  
   var marqueeText=marqueeObj.childNodes[0].innerHTML;  
   var marqueeContent=new Array();  
   var marqueeContent=marqueeText.split("|");   
   var marqueeInterval=new Array();  
   var obj=this;  
   this.init =  function () {  
       var str=marqueeContent[0];  
     marqueeObj.childNodes[0].innerHTML=str;  
     marqueeObj.style.display="block";  
     marqueeObj.style.height=hg+"px";  
       marqueeId++;  
       marqueeInterval[0]=setInterval(obj.startMarquee,Delay);      
   }  
   marqueeObj.onmouSEOver=function(){  
     clearInterval(marqueeInterval[0]);  
   }  
   marqueeObj.onmouseout=function(){  
     marqueeInterval[0]=setInterval(obj.startMarquee,Delay)  
   }  
   this.startMarquee=function(){   
     var str=marqueeContent[marqueeId];  
       marqueeId++;  
       if(marqueeId>=marqueeContent.length) marqueeId=0;  
       if(marqueeObj.childNodes.length==1)  
       {  
         var nextLine=document.createElement('DIV');  
         nextLine.style.height=hg+"px";  
         nextLine.innerHTML=str;  
         marqueeObj.appendChild(nextLine);  
       }  
       else  
       {  
         marqueeObj.childNodes[0].innerHTML=str;  
         marqueeObj.childNodes[0].style.height=hg+"px";  
         marqueeObj.appendChild(marqueeObj.childNodes[0]);  
         marqueeObj.scrollTop=0;  
       }  
       clearInterval(marqueeInterval[1]);  
       if(flag=="Alpha"){  
         marqueeInterval[1]=setInterval(obj.doAlpha,20);  
       }   
       else{     
         marqueeInterval[1]=setInterval(obj.scrollMarquee,20);  
       }  
            
   }  
   this.scrollMarquee=function(){  
       marqueeObj.scrollTop++;  
       if(marqueeObj.scrollTop%hg==(hg-1)){  
           clearInterval(marqueeInterval[1]);  
       }  
     }  
   this.doAlpha = function(){  
     Opacity+=3;    
     marqueeObj.style.filter = "alpha(opacity="+Opacity+");";  
     marqueeObj.style.opacity=Opacity/100;  
     if ((Opacity+=3) > 90){  
       clearInterval(marqueeInterval[1]);  
       Opacity=0;  
     }  
   }  
    
   //class结束  

Tags:js 文本 行内

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接