用javascript使链接按钮不断变化

日　期：2006-10-22 来　源：阅读:

用JavaScript使链接按钮不断变化

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

点击此处查看效果

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

< SCRIPT LANGUAGE="JavaScript" >
< !-- begin
// please help yourself to this code.
var startTime =null;
var timerID =null;
var initial =new Date();
var pos =0;
var menuItem =null;

function initArray() {
this.length = initArray.arguments.length
for (var i = 0; i < this.length; i++) {
this[i+1] = initArray.arguments[i]
}
}

function parsemenuItem(data，num) {
for(var i=0;i< data.length;i++) {
if(data.substring(i，i+1)=="|") break;
}
if (num==0) return(data.substring(0，i));
else return(data.substring(i+1，data.length));
}

function startTimer() {
initial = new Date();
startTime=initial.getTime();
stopTimer();
menuItem = new initArray("赛迪网Windows世界|http://www.ccidnet.com/school/system/"，
"赛迪网冲浪指南针|http://www.ccidnet.com/school/net/"，
"赛迪网软件下载园|http://www.ccidnet.com/school/soft/"，
"赛迪网办公自动化|http://www.ccidnet.com/school/office/"，
"赛迪网软件e学堂|http://www.ccidnet.com/school/software/"，
"赛迪网多媒体之家|http://www.ccidnet.com/school/multimedia/"，
"赛迪网培训与考试|http://www.ccidnet.com/school/exam/"，
"赛迪网电脑大词典|http://www.ccidnet.com/school/dict/"
);
showTimer();
}

function stopTimer() {
timerID=null;
menuItem=null;
//clearTimeout(timerID);
}

function showTimer() {
pos= (pos == menuItem.length) ? 1 : pos + 1;
document.forms[0].elements[0].
value=parsemenuItem(menuItem[pos]，0);

timerID=window.setTimeout('showTimer()'，4000);
}

function goToUrl() {
//parent.welcome.location=parsemenuItem(menuItem[pos]，1);
this.location=parsemenuItem(menuItem[pos]，1);
return (false);
}
// end -- >
< /SCRIPT >

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

二、把下面的代码加入到< body >区域中。

< FORM >
< INPUT TYPE="button" VALUE=" zhouqing " NAME="goTo"
onClick="window.goToUrl()" >
< /FORM >

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

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

上一篇：javascript中如何实现浏览器上的右键菜单下一篇：利用javascript制作倒计时牌

收藏本文到:

查看全部JavaScript内容

javascript中如何实现浏览器上的右键菜单　 2006-10-22 00:00:00
如何实现浏览器上的右键菜单最近在程序员大本营中的讨论中有一位老兄提出如何在浏览器中实现类似于应用程序的鼠标右击后出现右键菜单的效果。唯鱼试了试，发现不是很难解...[阅读全文]
利用javascript制作倒计时牌　 2006-10-22 00:00:00
利用JavaScript制作倒计时牌五一劳动节很快就到了。哈哈，到时可以出去好好玩一玩了。是不是在掐指计算了。下面教你一种方法在网页上面制作倒计时牌，这样就方便多了。把...[阅读全文]
javascript进行客户端数据的校验(2)　 2006-10-22 00:00:00
html网页代码：＜html ＜head ＜title文章发布＜/title ＜link rel="stylesheet" type="text/css" href="style.css" ＜/head ＜body bgcolor=#fafee9 ＜center原创文章投...[阅读全文]
用javascript实现变色背景和文字(1)　 2006-10-22 00:00:00
用JavaScript实现变色背景和文字制作变色背景和文字的JavaScript代码有很多种，不过大多数背景颜色变化时有跳跃感，不够柔和。本例的效果特别酷！请看效果：背景请用bgc...[阅读全文]
javascript进行客户端数据的校验(1)　 2006-10-22 00:00:00
//客户端对用户输入数据校验 //如果输入的内容不满足，则不提交，并且焦点自动跳到该位置。 //比发送以后在服务器端校验数据要好用的多！脚本代码：＜script language="J...[阅读全文]
javascript[对象.属性]集锦之四　 2006-10-22 00:00:00
form对象属性 name 中的NAME属性的字符串值. method 中METHOD属性的类值,"0"="GET" ,"1"="POST" . action 中ACTION属性的字符串值. target 表格数据提交的目标,与标记中相...[阅读全文]
点一下，首页地址添加到收藏夹　 2006-10-22 00:00:00
我们都希望自己辛苦制作的主页能够成为网友们的收藏夹中的东东，于是我们不停的用各种方法吸引网友的注意力，大声的告诉他们：如果你觉得的好，就把我的主页填加到你的收藏...[阅读全文]
javascript[对象.属性]集锦之六　 2006-10-22 00:00:00
select对象属性 length select对象中对象的个数. name 由NAME=属性定义的select对象的内部名. selectedIndex select对象中当前被选option的下标. options 该属性对应于在H...[阅读全文]
利用javascript制作简单动画　 2006-10-22 00:00:00
如果你需要改变动画播放速度, 比如每5秒换一张图片改变setTimeout("imgturn('" +numb+ "')", 1000)中的1000为5000 ＜html ＜head ＜title＜/title ＜script language="Jav...[阅读全文]
javascript版的日期输入控件(6)　 2006-10-22 00:00:00
td width="15%" align="center" id="day" onclick="add_day(year.innerText,month.innerText,this.innerText)" /td /tr tr td width="14%" align="center" id="day" onclic...[阅读全文]
javascript[对象.属性]集锦之十　 2006-10-22 00:00:00
Math对象属性 LN10 (10的自然对数) PI (3.1415926...) SQRT1_2 (1/2的平方根) 方法 abs(x) 返回x的绝对值 acos(x) 返回x的arc cosine值 asin(x) 返回x的arc sin值 atan(x)...[阅读全文]
源码学习:一个简单的日历控件(1)　 2006-10-22 00:00:00
calendar.js function atCalendarControl(){ var calendar=this; this.calendarPad=null; this.prevMonth=null; this.nextMonth=null; this.prevYear=null; this.nextYear=...[阅读全文]
javascript[对象.属性]集锦之九　 2006-10-22 00:00:00
Date对象要使用Date对象,必须先生成一个Date实例: 变量名=new Date(); 方法 getDay(),getDate(),getHours(),getMinutes(),getMonth(),getSeconds(),getTime(), getTimeZon...[阅读全文]
源码学习:一个简单的日历控件(2)　 2006-10-22 00:00:00
var tbBoard=document.createElement("table"); divBoard.insertAdjacentElement("beforeEnd",tbBoard); tbBoard.style.cssText="position:absolute;top:0;left:0;width:10...[阅读全文]
javascript[对象.属性]集锦之八　 2006-10-22 00:00:00
string对象 string对象为操作字符串的内容提供了很多方法. 属性 length 字符串的长度,即字符串中字符的个数. 方法 big(),blink(),bold(),fixed(),italics(),small(),sub(),...[阅读全文]
javascript对象与数组参考大全(14)　 2006-10-22 00:00:00
Onselect 选取事件 B.30 textarea对象它是form对象的一个属性,宙体中的一个文本区域(TEXTAREA)。属性 defaultValue textarea对象的缺省值(VALUE=特性) name 该对象的名字...[阅读全文]
javascript[对象.属性]集锦之七　 2006-10-22 00:00:00
submit和reset对象属性 value VALUE=属性的内容. name NAME=属性的内容. 方法 click() 选定按钮事件处理器 onClick 当按钮被单击时执行. password对象属性 defaultValue...[阅读全文]
javascript对象与数组参考大全(15)　 2006-10-22 00:00:00
length 窗口内的框架数 location 窗口所显示文档的完整(绝对)URL(该属性本身也是一个对象)不要把它与如document.location混淆,后者是当前显示文档的URL。用户可以改变windo...[阅读全文]
图片控制的渐变色文字(1)　 2006-10-22 00:00:00
　　以前我们看到的所谓连续渐变色文字，都是逐字变色的。而我们看到的下面的演示中的真正的连续渐变色文字，你应该没有见过吧？而且演示中是一个文本输入框，它可以接受用...[阅读全文]
javascript版的日期输入控件(1)　 2006-10-22 00:00:00
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" HTML HEAD TITLE New Document /TITLE META NAME="Generator" CONTENT="Microsoft FrontPage 5.0" META NA...[阅读全文]

点击复制本网址，与好友共享

[大中小] [收藏此页] [打印此页] [关闭]

评论留言

用户名：（新注册）密码：匿名发表评论(0条)

评论内容：(不能超过250字，不支持HTML或代码，只能发表纯文字，请自觉遵守互联网相关政策法规。)

[an error occurred while processing this directive]

热点搜索

内衣写真汤加丽人体艺术裸体模特偷拍美女视频诱惑自拍美女性感张靓颖走光清纯少女劲舞视频经典搞笑后舍男生性感美女花花公子美女街舞广告欣赏全智贤

用javascript使链接按钮不断变化

收藏本文到:

查看全部JavaScript内容

相关文章

评论留言

热点搜索

娱乐中心精华推荐

资讯中心精华推荐