来自动网的打字效果-JS特效-爱易网页

来自动网的打字效果

日期：2014-05-18　浏览次数：20226 次

以下是HTML网页特效代码，点击运行按钮可查看效果：

以下是程序代码

<SCRIPT language=JAVAscript>
 // ------ 定义全局变量
 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="http://p.dvbbs.net/dispbbs-11-0-1-20932-0-0-0" target="_blank"><font><b>众望所归 动网PHP 2.0正式发布</b></font></a>
<a href="http://p.dvbbs.net/" target="_blank"><font color="red"><b>动网论坛PHP官方站点</b></font></a>   </div>
   <div id=NewsLink  ></div>
  </div>
  </div>
 <div id=AddNews height="25"></div>
</div></font>
<a href="http://js.aiyiweb.com/">欢迎访问爱易网网页特效代码站，js.aiyiweb.com</a>

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

来自动网的打字效果

相关资料更多>

推荐阅读更多>