JavaScript特效集

最新推荐文章于 2023-03-27 23:33:08 发布

namelijian

最新推荐文章于 2023-03-27 23:33:08 发布

阅读量1.2k

点赞数

分类专栏：源代码天地文章标签： javascript animation function input button domain

本文链接：https://blog.csdn.net/namelijian/article/details/839683

版权

源代码天地专栏收录该内容

2 篇文章 0 订阅

订阅专栏

收集了一些网页类特效

网页类特效：

<script language="javascript">
function fun(form){
var str1=document.form.username.value;
var str2=document.form.userpwd.value;
var str3=document.form.userpwd1.value;
var str4=document.form.pwdqestion.value;
var str5=document.form.pwdanswer.value;
var str6=document.form.relname.value;
var str7=document.form.addr.value;
var email1=document.form.email.value;
if (str1.length>10||str1.length<5){
alert("用户名要5-10个字符");return false}
if (str2.length>10||str2.length<4){
alert("密码要4-10个字符");return false}
if (str3.length>10||str3.length<5){
alert("密码确认要5-10个字符");return false}
if(document.form.userpwd.value!=document.form.userpwd1.value){
alert("两次输入的密码不一致");return false}
if (str4.length==""){
alert("密码提示问题不能为空！");return false}
if (str5.length==""){
alert("密码答案不能为空！");return false}
if(email1.length==""||email1.indexOf('@')==-1||email1.indexOf('.')==-1){
alert("电子邮件格式不正确！");return false}
if (str6.length==""){
alert("真实姓名不能为空！");return false}
if (str7.length==""){
alert("地址不能为空！");return false}
if(isNaN(document.form.addrnum.value)){alert("邮编要数字！");return false}
if(isNaN(document.form.tel.value)||document.form.tel.value==""){alert("电话号码要数字!");return false}
else{ return true;}
}
</script>

　　单击按钮出现信息框

<html>
<form>
<input type="button" value="按我" onClick="alert('这是一个警告窗！'); return true">
</form>
</html>

　　单击查看源文件

<Html>
<FORM>

<script language="javascript">
function pr_view(urls)
{
var url="product_view.asp?p_id="+urls;
var po =

window.open(url,"p_view","toolbar=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=no,width=570,height=500");
po.focus();
}
</script>
<INPUT TYPE="BUTTON" VALUE="查看本页源代码" onClick= 'window.location = "view-source:" + window.location.href'>
</form>
</html>

　　单击将本站加入收藏夹

<script language="JavaScript">
function bookmarkit(){window.external.addFavorite('http://lovehy.126.com/','水晶情缘')}//改为你自己的网址和站名
if (document.all)document.write('<a href="http://lovehy.126.com" onClick="bookmarkit()">将本站加入收藏夹</a>')
</script>

　　单选调查样式

<html>
<form>
<div align="center"><center><p>本站很好: <input TYPE="radio" NAME="radio" value="谢谢您的鼓励和支持！"

onClick="alert(value)"><br>
本站一般: <input TYPE="radio" NAME="radio" value="我会不断努力的！" onClick="alert(value)"><br>
本站太差: <input TYPE="radio" NAME="radio" value="具体的意见建议请Email给我，谢谢！" onClick="alert(value)"><br>
</p>
</center></div>
</form></html

　　点击按钮保存当前页面

<html>
<input type="button" name="Button" value="点这保存这页面" onClick="document.all.WebBrowser.ExecWB(4,1)">
<object id="WebBrowser" width=0 height=0 classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">
</object>
</html>

　　点击按钮查看网页属性

<html>
<input type="button" name="Button" value="点击查看页面属性" onClick="document.all.WebBrowser.ExecWB(10,1) ">
<object id="WebBrowser" width=0 height=0 classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">
</object>
</html>

　　点击按钮打印当前页面

<SCRIPT LANGUAGE="JavaScript">

</script>

　　点击清除表单默认值

<html>
<form action="submit.asp" method="post" >
<input type="text" onFocus="this.value=''" value="Email address here">
<input type="submit" name="Submit" value="Submit">
</form>
</html>

　　点击全选所有复选框

<SCRIPT LANGUAGE="JavaScript">

</script>
<form name=myform action="" method=post>
<table width="133">
<tr><td width="125">
<b>软件系数调查：<br>
</b> <br>
<input type=checkbox name=list value="1">软件的界面<br>
<input type=checkbox name=list value="2">特效很多<br>
<input type=checkbox name=list value="3">分类详细<br>
<input type=checkbox name=list value="4">完全免费<br>
<input type=checkbox name=list value="5">特效很实用<br>
<input type=checkbox name=list value="6">更新速度快<br>
<br>
<input type=button value=" 全部选定 " onClick="this.value="/check(this.form.list)"">
</td></tr>
</table>
</form>

　　调用他人的网页

<html>
<object type="text/x-scriptlet" width="600" height="1000" data="../index.htm">
</object>
</html>

　　定时转跳到其它的页面

<html>
<meta http-equiv="refresh" content="3;url=../index.htm">
</html>

　　多个选择的搜索引擎

<form action="http://www2.yeah.net/cgi-bin/gosearch/search.cgi" name="searchform">
<div align="center"><center><table border="0">
<tr align="center" vAlign="center">
<td><select class="p9" name="site" size="1">
<option selected value="---------------">*** 搜索引擎大全 ***</option>
<option value="网易yeah搜索">网易yeah搜索</option>
<option value="中文雅虎">中文雅虎</option>
<option value="中文cseek">中文cseek</option>
<option value="搜狐">搜狐</option>
<option value="悠游中文搜索">悠游中文搜索</option>
<option value="常青藤搜索">常青藤搜索</option>
<option value="北极星">北极星</option>
<option value="若比邻搜索">若比邻搜索</option>
<option value="中经搜索">中经搜索</option>
<option value="视讯中文搜索">视讯中文搜索</option>
<option value="----------------">---------------------</option>
<option value="哇塞中文网(B5)">哇塞中文网(Big5)</option>
<option value="奇摩搜索">奇摩搜索(Big5)</option>
<option value="蕃薯藤(B5)">蕃薯藤(Big5)</option>
<option value="添达香港搜索器">添达香港搜索器(Big5)</option>
<option value="盖世引擎">盖世引擎(Big5)</option>
<option value="绿界探索引擎">绿界探索引擎(Big5)</option>
<option value="Coo台湾索引">Coo台湾索引(Big5)</option>
<option value="UFO搜索">UFO搜索(Big5)</option>
<option value="怪兽搜索">怪兽搜索(Big5)</option>
<option value="茉莉之窗搜索">茉莉之窗搜索(Big5)</option>
<option value="八爪魚搜索机">八爪魚搜索机(Big5)</option>
<option value="***英文搜索引擎***">---------------------</option>
<option value="英文Yahoo">英文 Yahoo!</option>
<option value="英文Locys">英文 Locys</option>
<option value="英文Excite">英文 Excite</option>
<option value="英文Infoseek">英文 Infoseek</option>
<option value="Altavista中英文搜索">Altavista中英文搜索</option>
<option value="dejanews">dejanews 讨论组搜索</option>

　　防止网页被纳入框架


<SCRIPT LANGUAGE=JAVASCRIPT>

</style>
</head>

<body bgcolor="#cccccc" text="#000000">
<table width="80" border="0" cellpadding="0" cellspacing="0" height="30">
<tr>
<td class=normal οnmοuseοver='this.className="over"' οnmοusedοwn='this.className="down"'

οnmοuseup='this.className="over"' οnmοuseοut='this.className="normal"' >
<div align="center" >
<a style="cursor: default" href="../index.htm" target="_blank">测试按钮</a>
</div>
</td>
</tr>
</table>
</html>

　　记住访问者的来访次数

<script language="JavaScript">

</script>

　　检测访问者的操作系统

<SCRIPT>
agent = navigator.userAgent;
if (agent.lastIndexOf("Win95"))
{
document.write(' Windows 95/98/ME');
}
else if (agent.lastIndexOf("Win16"))
{
document.write(' Windows 3.2');
}
else if (agent.lastIndexOf("Mac"))
{
document.write(' Macintosh');
}
else if (agent.lastIndexOf("Unix"))
{
document.write(' Unix');
}
else if (agent.lastIndexOf("Linux"))
{
document.write(' Linux');
}
</script>

　　将站点设为浏览器主页

<a href=# onClick="this.style.behavior='url(#default#homepage)';this.setHomePage
('http://lovehy.126.com/');">将本站设为首页</a>

　　进入页面弹出欢迎信息

<body onLoad= alert("您好，欢迎您访问本站！")>

　　离开时告诉你停留时间



<script language="JavaScript">

</script>
<body onUnload="bye()">

　　离开页面时告别信息框

<body onUnload= alert("再见，欢迎您再次光临！")>

　　认网页闪电一样的闪烁

<script LANGUAGE="JavaScript">
function blinkOn(){
theWin.document.bgColor = "000000"
nTimes++
JSCTimeOutID = window.setTimeout("blinkOff()",50);
}
function blinkOff(){
theWin.document.bgColor = "FFFFFF"
if (nTimes < 3)
JSCTimeOutID = window.setTimeout("blinkOn()",50);
else theWin.history.go(0)
}
function blinkit(aWin)
{
nTimes = 0
theWin = aWin
JSCTimeOutID = window.setTimeout("blinkOn()",50);
}
</script>



<form>
<div align="center"><center><p><input TYPE="BUTTON" VALUE="闪烁" onClick="blinkit(self)">
</p>
</center></div>
</form>

　　文本向上循环滚动

<table border="1" bordercolor="#000000" bgcolor="#6699ff" cellpadding="5" cellspacing="0">
<tr>
<td>
<script language=javascript>

document.write ("<marquee scrollamount='1' scrolldelay='30' direction= 'UP' width='200' id='helpor_net' height='150'

οnmοuseοver='helpor_net.stop()' οnmοuseοut='helpor_net.start()' Author:redriver; For more,visit:lovehy.126.com>")

document.write ("<h2><p align='center'><font color='#ffffff' face='黑体'>偶然</font></h2>")
document.write ("<p align='right'><a href='http://lovehy.126.com' target='_blank'><font color='#ffffff'>徐

志摩</font></a> ")
document.write ("<p><font color='#ffffff'> ")
document.write ("<br>我是天空里的一片云，")
document.write ("<br>偶尔投影在你的波心—— ")
document.write ("<br>你不必讶异, ")
document.write ("<br>更无须欢喜—— ")
document.write ("<br>在转瞬间消灭了踪影。")
document.write ("<br>")
document.write ("<br>你我相逢在黑暗的海上，")
document.write ("<br>你有你的，我有我的，方向；")
document.write ("<br>你记得也好， ")
document.write ("<br>最好你忘掉， ")
document.write ("<br>在这交会时互放的光亮！ ")
document.write ("</font>")

document.write ("</marquee> ")
</script>
</td>
</tr>
</table>

　　文字从页面顶部掉下来

<p lovehy_126_com="dropWord" style="position: relative !important; left: 10000 !important" align="center"><font

size="3" color="#ee00FF">很好玩吧 ! 有没有吓一跳 ?</font><font size="7" face="Arial"

color="#FF0000"><b>YES!</b></font></p>

<SCRIPT language="JavaScript">

</SCRIPT>

/*
* 返回当前年月日和星期
*/
function holedate(){
var d,s = "";
var day = new Array();
day[0] = "星期日";
day[1] = "星期一";
day[2] = "星期二";
day[3] = "星期三";
day[4] = "星期四";
day[5] = "星期五";
day[6] = "星期六";
var d = new Date();
s += d.getYear() + "-";
s += (d.getMonth() + 1) + "-";
s += d.getDate() + " ";
s += day[d.getDay()]
return s;
}

/*
* 全选或者全取消CHECKBOX
* ename为全选CHECKBOX的name
* flag为状态，真(1/true)为全选，假(0/flase)为全取消
*/
function selectall(ename, flag){
d = document.all[ename];//被选对象
n = document.getElementsByName(ename).length;
if(n > 0)
if(flag){//真为全选，假为全取消
if(n > 1)
for(i = 0; i < n; i++){
d[i].checked = true;
}
else
d.checked = true;
}else {
if(n > 1)
for(i = 0; i < n; i++){
d[i].checked = false;
}
else
d.checked = false;
}
}

/*
* 检测日期中的月和日的正确性
* 日期格式如：2004-05-04
*/
function datecheck(val){
var mydate = val.split("-");
var year = mydate[0]%4;//取得是否为润年
var month = mydate[1];//取得日期中的月份
var day = mydate[2];//取得日期中的日
if(month>12 || month == 0 || day == 0)
{return false;}
if(month==4||month==6||month==9||month==11){
if(day>30)
return false;
else
return true;
}
else if(month==2)
{
if(year==0&&day>29) //润月天数
return false;
else if(year!=0&&day>28)
return false;
else
return true;
}
else{
if(day>31)
return false;
else
return true;
}
}

/*
* 功能：表单内容格式检测
* 参数 obj 　　　为表单名称（ID）
* chktype　为类型，参照函数内释
*/
function chk(obj, chktype){
switch(chktype){
case 1://判断是否为空
if(obj.value == ""){
alert("请输入必要的字符。");
obj.focus();
obj.onselect();
}
break;
case 2://判断是否为数字
var reg = /^/d+(/./d+)?$/;
if(!reg.test(obj.value)){
alert("请输入数字。");
obj.focus();
obj.select();
}
break;
case 3://判断是否为用户名格式
var reg = /^[^/d/-_][/w/-]*[^/-_]$/;
if(!reg.test(obj.value)){
alert("请输入正确的格式。");
obj.focus();
obj.select();
}
break;
case 4://判断是否为汉字
var reg = /^[/u4E00-/u9FA5]*$/;
if(!reg.test(obj.value)){
alert("你输入的不全是汉字。");
obj.focus();
obj.select();
}
break;
case 5://判断是否为邮箱格式
var reg = /^[^/d/-_][/w/-]*[^/-_]@[^/-][a-zA-Z/d/-]*[^/-](/.[^/-][a-zA-Z/d/-]*[^/-])*/.[a-zA-Z]{3}(/.[a-zA-Z]{2})?$/;
if(!reg.test(obj.value)){
alert("你输入正确的邮箱格式。");
obj.focus();
obj.select();
}
break;
case 6://判断是否为合法日期格式
var reg = /^(19|20)/d/d/-(0|1)/d/-(0|1|2|3)/d$/;
if(!reg.test(obj.value)){
alert("你输入正确的日期格式。");
obj.focus();
obj.select();
}
break;
}
}

namelijian

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JavaScript特效集

收集了一些网页类特效网页类特效：function fun(form){var str1=document.form.username.value;var str2=document.form.userpwd.value;var str3=document.form.userpwd1.value;var str4=document.form.pwdqestion.value;var str5=do
复制链接

扫一扫