您当前位置:网站首页 >> 编程开发 >> JavaScript >> 用JavaScript使链接按钮不断变化

用JavaScript使链接按钮不断变化

2013-10-16 20:04:34 来源:奇库斯(QCOOLS) 浏览:174
关键字:JavaScript,链接,按钮,变化

内容提要:

按钮是网页中常常能见到的一种东东。但是用按钮做链接你可能还没有见到过。今天教你的这种方法,不仅可以用按钮来制作链接,而且按钮中链接还能不断变化显示。效果非常好看又能节省页面空间,真是一举两得,赶快试试吧!

  一、把下面的程序代码加入到<head></head>区域中。
  <SCRIP

  按钮是网页中常常能见到的一种东东。但是用按钮做链接你可能还没有见到过。今天教你的这种方法,不仅可以用按钮来制作链接,而且按钮中链接还能不断变化显示。效果非常好看又能节省页面空间,真是一举两得,赶快试试吧!


  一、把下面的程序代码加入到<head></head>区域中。
  <SCRIPT LANGUAGE="JavaScript"><BR><!-- begin<BR>// please help yourself to this code.<BR>var startTime =null;<BR>var timerID =null;<BR>var initial =new Date();<BR>var pos =0;<BR>var menuItem =null;<BR><BR>  function initArray() {<BR>this.length = initArray.arguments.length<BR>for (var i = 0; i < this.length; i++) {<BR>this[i+1] = initArray.arguments[i]<BR>}<BR>}<BR><BR>  function parsemenuItem(data,num) {<BR>for(var i=0;i<data.length;i++) {<BR>if(data.substring(i,i+1)=="|") break;<BR>}<BR>if (num==0) return(data.substring(0,i));<BR>else return(data.substring(i+1,data.length));<BR>}<BR><BR>  function startTimer() {<BR>initial = new Date();<BR>startTime=initial.getTime();<BR>stopTimer();<BR>menuItem = new initArray("赛迪网Windows世界|http://www.ccidnet.com/school/system/",<BR>"赛迪网冲浪指南针|http://www.ccidnet.com/school/net/",<BR>"赛迪网软件下载园|http://www.ccidnet.com/school/soft/",<BR>"赛迪网办公自动化|http://www.ccidnet.com/school/office/",<BR>"赛迪网软件e学堂|http://www.ccidnet.com/school/software/",<BR>"赛迪网多媒体之家|http://www.ccidnet.com/school/multimedia/",<BR>"赛迪网培训与考试|http://www.ccidnet.com/school/exam/",<BR>"赛迪网电脑大词典|http://www.ccidnet.com/school/dict/"<BR>);<BR>showTimer();<BR>}<BR><BR>  function stopTimer() {<BR>timerID=null;<BR>menuItem=null;<BR>//clearTimeout(timerID);<BR>}<BR><BR>  function showTimer() {<BR>pos= (pos == menuItem.length) ? 1 : pos + 1;<BR>document.forms[0].elements[0].<BR>value=parsemenuItem(menuItem[pos],0);<BR><BR>  timerID=window.setTimeout(´showTimer()´,4000);<BR>}<BR><BR>  function goToUrl() {<BR>//parent.welcome.location=parsemenuItem(menuItem[pos],1);<BR>this.location=parsemenuItem(menuItem[pos],1);<BR>return (false);<BR>}<BR>// end --><BR></SCRIPT><BR>

注:上面的链接和说明可以自己修改,上面('showTimer()',4000)中的4000是用来设置链接之间变化速度,数字越小速度越快。


  二、把下面的代码加入到<body>区域中。
<FORM>
<INPUT TYPE="button" VALUE=" zhouqing " NAME="goTo"
onClick="window.goToUrl()">
</FORM>

三、最后把<body>中的内容改为如下代码。

<body bgcolor="#ffffff" onLoad="window.startTimer()">



相关文章
发表评论
网名:
评论:
验证:
共有0人对本文发表评论查看所有评论(仅供表达个人看法,并不表明本站同意其观点或证实其描述)
赞助商链接
点击排行