文字打字效果弹出显示js代码

2016-11-21 网页编程网 网页编程网

<SCRIPT>
 // ------ 定义全局变量
 var theNewsNum;
 var theAddNum;
 var totalNum;
 var CurrentPosion=0;
 var theCurrentNews;
 var theCurrentLength;
 var theNewsText;
 var theTargetLink;
 var theCharacterTimeout;
 var theNewsTimeout;
 var theBrowserVersion;
 var theWidgetOne;
 var theWidgetTwo;
 var theSpaceFiller;
 var theLeadString;
 var theNewsState;
 function startTicker(){
  // ------ 设置初始数值
  theCharacterTimeout = 50;//字符间隔时间
  theNewsTimeout = 2000;//新闻间隔时间
  theWidgetOne =  "_";//新闻前面下标符1
  theWidgetTwo =  "-";//新闻前面下标符
  theNewsState = 1;
  theNewsNum = document.getElementById("incoming").children.AllNews.children.length;//新闻总条数
  theAddNum = document.getElementById("incoming").children.AddNews.children.length;//补充条数
  totalNum =theNewsNum+theAddNum;
  theCurrentNews = 0;
  theCurrentLength = 0;
  theLeadString = " ";
  theSpaceFiller = " ";
  runTheTicker();
 }
 // --- 基础函数
 function runTheTicker(){
  if(theNewsState == 1){
   if(CurrentPosion<theNewsNum){
    setupNextNews();
   }
   else{
    setupAddNews();
   }
   CurrentPosion++;
   if(CurrentPosion>=totalNum||CurrentPosion>=1){
    CurrentPosion=0;//最多条数不超过num_gun条
   }
  }
  if(theCurrentLength != theNewsText.length){
   drawNews();
  }
  else{
   closeOutNews();
  }
 }
 // --- 跳转下一条新闻
 function setupNextNews(){
  theNewsState = 0;
  theCurrentNews = theCurrentNews % theNewsNum;
  theNewsText = document.getElementById("AllNews").children[theCurrentNews].children.Summary.innerText;
  theTargetLink = document.getElementById("AllNews").children[theCurrentNews].children.Summary.children[0].href;
  theCurrentLength = 0;
  document.all.hottext.href = theTargetLink;
  theCurrentNews++;
 }
 function setupAddNews() {
  theNewsState = 0;
  theCurrentNews = theCurrentNews % theAddNum;
  theNewsText = document.getElementById("AllNews").children[theCurrentNews].children.Summary.innerText;
  theTargetLink = document.getElementById("AllNews").children[theCurrentNews].children.Summary.children[0].href;
  theCurrentLength = 0;
  document.all.hottext.href = theTargetLink;
  theCurrentNews++;
 }
 // --- 滚动新闻
 function drawNews(){
  var myWidget;
  if((theCurrentLength % 2) == 1){
   myWidget = theWidgetOne;
  }
  else{
   myWidget = theWidgetTwo;
  }
  document.all.hottext.innerHTML = theLeadString + theNewsText.substring(0,theCurrentLength) + myWidget + theSpaceFiller;
  theCurrentLength++;
  setTimeout("runTheTicker()", theCharacterTimeout);
 }
 // --- 结束新闻循环
 function closeOutNews(){
  document.all.hottext.innerHTML = theLeadString + theNewsText + theSpaceFiller;
  theNewsState = 1;
  setTimeout("runTheTicker()", theNewsTimeout);
 }
window.onload=startTicker;
</SCRIPT>
<a href="" id="hottext"></a>
<div id=incoming style="DISPLAY: none;float:left">
 <div id=AllNews >
   <div id=0>
   <div id="Summary" style="border:1px solid red">
    <a href="#" target="_blank"><font><b>这个效果不错吧~_~</b></font></a>
<a href="#" target="_blank"><font color="red"><b>欢迎来</b></font></a>   </div>
   <div id=NewsLink  ></div>
  </div>
  </div>
 <div id=AddNews height="25"></div>
</div>

阅读原文

阅读 4371

123 显示电脑版