跑馬燈文字

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE>跑馬燈文字的js</TITLE>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="Nassir wen">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <SCRIPT LANGUAGE="JavaScript">
  <!--
 //定義全局數組,用來保存輸入的消息
 var item = new Array();

 //初始化顯示消息時,每個數組元素的開始位置
 var pos = 0;

 //初始化顯示消息時,數組的開始位置
 var msgcode = 0;

 //初始化顯示消息時,二個數組元素間間隔的延遲時間
 var timeoutid = 0;

 //var delay = 0;
 //顯示跑馬燈文字的函數
 function showmsg(){
  //判斷是否輸入消息
  if(item.length == 0){
   alert("請先輸入消息!");
  }else{
   document.runform.runtext.blur();
   //從第一個數據元素的第一個字符開始顯示
   document.runform.runtext.value=item[msgcode].substring(0,pos+1);
   //alert(document.runform.runtext.value + "--pos" + pos);
   if(++pos >= item[msgcode].length){
//    alert(pos);
    pos = 0;
    msgcode++;
    delay = 500;
   }else{
    delay = 100;
   }
   if(msgcode > (item.length -1)){
    msgcode = 0;
   }
   if(document.runform.input.value != ""){
    clearTimeout(timeoutid);
   }else{
    //設置延遲時間來顯示數組元素
    timeoutid = setTimeout("showmsg();",delay);
   }
  }
 }

 //保存消息的函數
 function insertmsg(){
  pos = 0;
  msgcode = 0;
  var num = item.length;
  //判斷是否有輸入消息
  if(document.runform.input.value != ""){
   item[num] = document.runform.input.value;
   document.runform.input.value = ""
  }else{
   alert("請先輸入消息!");
   document.runform.input.value = "";
  }
 }

  //-->
  </SCRIPT>
 </HEAD>

 <BODY>
     <form name="runform">
  <input type="text" name="input"  size="50">
  <br>
  <input type="button" name="insert" value="加入消息" onClick="insertmsg()">
  <input type="button" name="display" value="顯示消息" onClick="showmsg()">
  <br>
  <input type="text" name="runtext" size="50">
  </form>
 </BODY>
</HTML>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章