js网页按钮特效源码.docx

资源描述

js网页按钮特效源码.docx

《js网页按钮特效源码.docx》由会员分享，可在线阅读，更多相关《js网页按钮特效源码.docx（16页珍藏版）》请在冰豆网上搜索。

js网页按钮特效源码.docx

js网页按钮特效源码

1前进后退

按钮特效篇--前进/后退

--案例代码1开始-->

functionGoForward（）{

form1.Button2.value="前进中"

history.go

（1）

}

functionGoBack（）{

form1.Button1.value="后退中"

history.go（-1）

}

--案例代码1结束-->

--案例代码2开始-->

--[Step1]:

这里可以更改按钮的名称-->

>"onClick="GoForward（）">

--案例代码2结束-->

2对话框输入限制

按钮特效篇--对话框输入限制

--案例代码1开始-->

functionInputChar（cur）{

--[Step1]:

这里可以设置输入字符的最大长度-->

varmaxlength=100

if（cur.chars.value.length>maxlength）{

--[Step2]:

在此能够更改弹出窗口的警告信息-->

alert（"已经超出了100个字符，请重新填写！

"）

returnfalse}

}

--案例代码1结束-->

--案例代码2开始-->

--[Step3]:

这里可以更改页面提示信息的大小-->

--[Step4]:

在此能够修改页面提示信息的颜色-->

--[Step5]:

这里可以更改页面的提示信息-->

请输入您的建议（不多于100个字符）:

--[Step6]:

在此能够设置文本区域的行数和列数-->

--[Step7]:

这里可以更改按钮的名称-->

--案例代码2结束-->

3组合框跳转

按钮特效篇--组合框跳转

--案例代码开始-->

--[Step1]:

在此能够更改链接对应的网址-->

--[Step2]:

这里可以设置页面显示的链接信息-->

263在线

搜狐网

新浪网

雅虎网

--[Step3]:

在此能够修改按钮的名称-->

--案例代码结束-->

4全部选取

按钮特效篇--全部选取

--案例代码1开始-->

functionSelectAll（FieldArea）{

vartempval=eval（"document."+FieldArea）

tempval.focus（）

tempval.select（）

}

--案例代码1结束-->

--案例代码2开始-->

--[Step1]:

这里能够更改按钮的名称-->

--[Step2]:

在此可以设置文本区域的行数和列数-->

请在此输入您的建议：

--案例代码2结束-->

5字段清除

按钮特效篇--字段清除

--案例代码1开始-->

functionClearAll（TextMessage）{

if（TextMessage.value==TextMessage.defaultValue）{TextMessage.value=""}

}

--案例代码1结束-->

--案例代码2开始-->

--案例代码2结束-->

6字段确认

按钮特效篇--地址确认

--案例代码1开始-->

varindex

functionChecked（）{

if（document.layers||document.all）returnValidationEmail（）

elsereturntrue

}

functionValidationEmail（）{

varstr=document.validation.emailAddress.value

varfilter=/^.+@.+\..{2,3}$/

if（filter.test（str））index=true

else{

--[Step1]:

这里可以设置弹出窗口的警告信息-->

alert（"输入的Email地址不正确！

"）

index=false}

return（index）

}

--案例代码1结束-->

--案例代码2开始-->

--[Step2]:

在此能够更改页面显示的提示信息-->

请输入您的E-mail地址:

--[Step3]:

这里可以设置文本框的列长度-->

--[Step4]:

在此能够修改按钮的名称-->

--案例代码2结束-->

7显示滚动字段

按钮特效篇--显示滚动字段

--案例代码开始-->

vars=0

--[Step1]:

这里可以更改滚动字段的信息-->

varScrollMessage="按钮上显示滚动的字段"

document.write（""）

functionScrollButton（）{

document.Button1.ScMessage.value=ScrollMessage.substring（s,ScrollMessage.length）+ScrollMessage.substring（0,s）

s++

if（s>=ScrollMessage.length）{s=0}

--[Step2]:

在此能够设置滚动的速度，数值大速度慢-->

setTimeout（"ScrollButton（）",100）

}

ScrollButton（）;

--案例代码结束-->

8显示时间

按钮特效篇--显示时间

--案例代码开始-->

functionButtonClock（）{

day=newDate（）;

HourNow=day.getHours（）;

MinuteNow=day.getMinutes（）;

SecondNow=day.getSeconds（）;

TimeNow=day.getTime（）;

if（HourNow==0）{hour=12;ap="am";}

elseif（HourNow<=11）{ap="am";hour=HourNow;}

elseif（HourNow==12）{ap="pm";hour=12;}

elseif（HourNow>=13）{hour=（HourNow-12）;ap="pm";}

if（HourNow>=13）{hour=HourNow-12;}

if（MinuteNow<=9）{minute="0"+MinuteNow;}

else（minute=MinuteNow）

if（SecondNow<=9）{second="0"+SecondNow;}

else{second=SecondNow;}

time=hour+":

"+minute+":

"+second+ap;

document.form.button.value=time;

self.status=time;

setTimeout（'ButtonClock（）',1000）;

}

document.write（""+""）;

onError=null;

functionAlertWindow（）{

--[Step1]:

这里可以设置弹出窗口的警告信息-->

alert（"按钮可以显示时间！

"）;

}

ButtonClock（）;

--案例代码结束-->

9改变按钮颜色

按钮特效篇--改变按钮

--案例代码1开始-->

functionChangeButton（s）{

if（"INPUT"==event.srcElement.tagName）event.srcElement.className=s

}

--案例代码1结束-->

--案例代码2开始-->

--[Step2]:

这里可以设置按钮的名称-->

--案例代码2结束-->

10发送email

按钮特效篇--发送Email

按钮特效篇--发送E-mail

--案例代码开始-->

--[Step1]:

在此可以设置按钮的名称-->

--[Step2]:

这里能够更改email的地址-->

helemian@'">

--案例代码结束-->

11新型功能按钮

按钮特效篇--新型按钮

--案例代码1开始-->

varmax=0;

functionButtonList（）{

max=ButtonList.arguments.length;

for（i=0;i

}

--[Step1]:

在此可以设置按钮显示的滚动信息-->

tl=newButtonList（"263在线","中国人的网上家园"）;

varx=0;pos=0;

varl=tl[0].length;

functionNewTypeButton（）{

document.form1.typebutton.value=tl[x].substring（0,pos）+"";

if（pos++==l）{pos=0;setTimeout（"NewTypeButton（）",1500）;x++;if（x==max）x=0;l=tl[x].length;}

--[Step2]:

这里能够设置滚动信息的速度，数值大速度慢-->

elsesetTimeout（"NewTypeButton（）",100）;

}

--案例代码1结束-->

--案例代码2开始-->

--[Step3]:

在此可以更改按钮对应的网址-->

--案例代码2结束-->

12多功能按钮

按钮特效篇--多功能按钮

--案例代码1开始-->

--[Step1]:

这里可以设置弹出窗口的信息-->

functionAlertButton（）{window.alert（"欢迎您光临我的主页！

"）;}

--[Step2]:

在此能够更改默认首页的网址-->

functionHomePageButton（）{location.href="";}

--[Step3]:

这里可以修改新窗口打开的网址-->

--[Step4]:

在此能够更改新窗口的宽度、高度-->

--[Step5]:

这里可以设置新窗口的参数-->

functionNewWindowButton（）{window.open（"","","width=300,height=200,status=yes,location=no,toolbar=yes,directories=no,menubar=yes"）;}

--案例代码1结束-->

--案例代码2开始-->

--[Step6]:

在此可以设置按钮的名称-->

展开阅读全文