首页
-
业界新闻
-
新手上网
-
网页制作
-
网络编程
-
网站运营
-
网络营销
-
动画制作
-
图形图像
-
特效代码
-
网页素材
-
视频教程
-
资源下载
-
酷站赏析
-
免费模板
不支持Flash
首页
→
特效代码
搜索:
标题
内容
作者
阅读新闻
非常酷的页面综合效果
[日期:
2007-03-23
]
来源:
作者:
[字体:
大
中
小
]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>网页特效---非常酷的综合效果</title> </head> <BODY bgColor=#000000 onload=Setting()> <P align=center> </P> <P align=center> </P> <P align=center> </P> <P align=center> </P> <P align=center> </P> <P align=center><u><font face="Arial Black" color="#8080FF">
javascript
</font></u></P> <SPAN id=Set style="FONT: bold 24pt arial; POSITION: relative; VISIBILITY: hidden"> <P> </P> <P><font color="#FFFF00">Welcome to I - TIME !</font><BR></SPAN></P> <DIV id=Text1 style="COLOR: white; FONT: bold 16pt arial; POSITION: absolute; VISIBILITY: hidden"> <P>欢迎来到</P></DIV> <DIV id=Text2 style="COLOR: red; FONT: bold 20pt arial; POSITION: absolute; VISIBILITY: hidden"> <P> javascript </P></DIV> <DIV id=Text3 style="COLOR: blue; FONT: bold 26pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><BIG>页面特效</BIG></P></DIV> <DIV id=Text4 style="COLOR: black; FONT: bold 16pt arial; POSITION: absolute; VISIBILITY: hidden"></DIV> <DIV id=Title2 style="COLOR: gray; FONT: bold 24pt arial; POSITION: absolute; VISIBILITY: hidden"> <P>精彩javascript <BR>网页特效观止</P></DIV> <DIV id=Title1 style="color: white; font-style: normal; font-variant: normal; font-weight: bold; font-size: 24pt; font-family: arial; position: absolute; visibility: hidden; left: 13; top: 101; width: 700; height: 93"> <P>精彩javascript <BR>网页特效观止</P></DIV> <DIV id=Circle0 style="COLOR: steelblue; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT size=4>欢</FONT></P></DIV> <DIV id=Circle1 style="COLOR: steelblue; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT size=4>迎</FONT></P></DIV> <DIV id=Circle2 style="COLOR: steelblue; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT size=4>光</FONT></P></DIV> <DIV id=Circle3 style="COLOR: steelblue; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT size=4>临</FONT></P></DIV> <DIV id=Circle4 style="COLOR: steelblue; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ffff00 size=4>*</FONT></P></DIV> <DIV id=Circle5 style="COLOR: steelblue; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff0000 size=4>页</FONT></P></DIV> <DIV id=Circle6 style="COLOR: steelblue; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff0000 size=4>面</FONT></P></DIV> <DIV id=Circle7 style="COLOR: orange; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff0000 size=4>特</FONT></P></DIV> <DIV id=Circle8 style="COLOR: pink; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff0000 size=4>效</FONT></P></DIV> <DIV id=Circle9 style="COLOR: pink; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff0000 size=4>站</FONT></P></DIV> <DIV id=Circle10 style="COLOR: orange; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT size=4>*</FONT></P></DIV> <DIV id=Circle11 style="COLOR: lightseagreen; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>热</FONT></P></DIV> <DIV id=Circle12 style="COLOR: lightseagreen; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>烈</FONT></P></DIV> <DIV id=Circle13 style="COLOR: lightseagreen; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>欢</FONT></P></DIV> <DIV id=Circle14 style="COLOR: lightseagreen; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>迎</FONT></P></DIV> <DIV id=Circle15 style="COLOR: lightseagreen; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>光</FONT></P></DIV> <DIV id=Circle16 style="COLOR: orange; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>临</FONT></P></DIV> <DIV id=Circle17 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>我</FONT></P></DIV> <DIV id=Circle18 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>的</FONT></P></DIV> <DIV id=Circle19 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>站</FONT></P></DIV> <DIV id=Circle20 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#8080ff size=4>点</FONT></P></DIV><DIV id=Circle21 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff80c0 size=4>*</FONT></P></DIV> <DIV id=Circle22 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff0000 size=4>记</FONT></P></DIV> <DIV id=Circle23 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff0000 size=4>住</FONT></P></DIV> <DIV id=Circle24 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff0000 size=4>网</FONT></P></DIV> <DIV id=Circle25 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff0000 size=4>址</FONT></P></DIV> <DIV id=Circle26 style="COLOR: lemonchiffon; FONT: bold 11pt arial; POSITION: absolute; VISIBILITY: hidden"> <P><FONT color=#ff80c0 size=4>*</FONT></P></DIV> <DIV id=Now style="COLOR: orange; FONT: bold 24pt arial; POSITION: absolute; VISIBILITY: hidden"></DIV> <DIV id=Title3 style="COLOR: orange; FONT: bold 24pt arial; POSITION: absolute; VISIBILITY: hidden"></DIV> <DIV id=Add style="FONT: bold 24pt arial; POSITION: absolute; TEXT-ALIGN: right; VISIBILITY: hidden; WIDTH: 250px"></DIV> <DIV id=Entry style="FONT: bold 24pt arial; POSITION: absolute; TEXT-ALIGN: right; VISIBILITY: hidden; WIDTH: 250px"> <P> </P></DIV> <SCRIPT> var IsIE4 = (navigator.appVersion.charAt(0) >= 4 && navigator.appName == "Microsoft Internet Explorer"); var IsNN4 = (navigator.appVersion.charAt(0) >= 4 && navigator.appName == "Netscape"); var Title1,Title2,Title3,Text1,Text2,Text3,Text4,Now,Add,Entry; var CenterX,CenterY,Pi,Inc; var Circle = new Array(); var Pos = new Array(); var NowLeft,NowTop; var Count = 0; var Bright = 0; var Brightfold = true; var ColorIndex = "0123456789ABCDEFFF"; if(!(IsIE4||IsNN4)) top.location="building.html"; function SetCenter() { this.left = (innerWidth - this.clip.width) / 2; this.top = (innerHeight - this.clip.height) / 2; } function Setting() { var doc = (IsNN4)? "document." : "document.all."; var obj = (IsNN4)? "" : ".style"; Title1 = eval(doc+"Title1"+obj); Title2 = eval(doc+"Title2"+obj); Title3 = eval(doc+"Title3"+obj); Text1 = eval(doc+"Text1"+obj); Text2 = eval(doc+"Text2"+obj); Text3 = eval(doc+"Text3"+obj); Text4 = eval(doc+"Text4"+obj); Now = eval(doc+"Now"+obj); Add = eval(doc+"Add"+obj); Entry = eval(doc+"Entry"+obj); for(i=0;i<=25;i++) Circle[i] = eval(doc+"Circle"+i+obj); if(IsNN4) { Layer.prototype.setCenter = SetCenter; LayerWidth = document.Set.clip.width; LayerHeight = document.Set.clip.height; BodyWidth = innerWidth; BodyHeight = innerHeight; Title1.setCenter(); Title2.setCenter(); Title3.setCenter(); Entry.setCenter(); Now.setCenter(); Title1.top = Title1.top - 24; Title2.top = Title2.top - 24; Title3.top = Title3.top - 24; Now.top = Entry.top - 90; Now.left = Entry.left - 110; Entry.top = Entry.top + 30; Entry.left = Entry.left + 35; } else { BodyWidth = document.body.offsetWidth; BodyHeight = document.body.offsetHeight; LayerWidth = document.all.Set.offsetWidth; LayerHeight = document.all.Set.offsetHeight; SetLeft = (BodyWidth - LayerWidth) / 2; SetTop = (BodyHeight - LayerHeight) / 2; Title1.left = SetLeft; Title1.top = SetTop - 24; Title2.left = SetLeft; Title2.top = SetTop - 24; Title3.left = SetLeft; Title3.top = SetTop - 24; Now.left = SetLeft - 55; Now.top = SetTop - 65; Add.left = SetLeft + 85; Add.top = SetTop + 55; Entry.left = SetLeft + 85; Entry.top = SetTop + 75; } CenterX = BodyWidth / 2 - 5; CenterY = BodyHeight / 2 - 5; Radius = 160; Pi = Math.PI; Inc = Pi/180; Pos[0] = 0; for(i=1;i<Circle.length;i++) Pos[i] = parseFloat(Pos[i-1] + ((2*Pi)/Circle.length)); for(i=0;i<Pos.length;i++) { Pos[i] = Pos[i] + Inc; Circle[i].left = Radius*Math.cos(Pos[i]) + CenterX - 5; Circle[i].top = Radius*Math.sin(Pos[i]) + CenterY - 5; } NowLeft = (BodyWidth - LayerWidth) / 2 - 100; NowTop = (BodyHeight - LayerHeight) / 2 - 115; MoveText1(); } function MoveText1() { Text1.visibility = "visible"; Text1.left = NowLeft; Text1.top = NowTop; NowLeft = NowLeft + 10; NowTop = NowTop + 5; if(NowLeft < (BodyWidth - LayerWidth) / 2 - 10 ) MoveText1ID = setTimeout("MoveText1()",50); else { clearTimeout(MoveText1ID); NowLeft = (BodyWidth - LayerWidth) / 2 + 200; NowTop = (BodyHeight - LayerHeight) / 2 - 115; MoveText2(); } } function MoveText2() { Text2.visibility = "visible"; Text2.left = NowLeft; Text2.top = NowTop; NowLeft = NowLeft - 8; NowTop = NowTop + 5; if(NowLeft > (BodyWidth - LayerWidth) / 2 + 90 ) MoveText2ID = setTimeout("MoveText2()",50); else { clearTimeout(MoveText2ID); NowLeft = (BodyWidth - LayerWidth) / 2 - 50; NowTop = (BodyHeight - LayerHeight) / 2 + 115; MoveText3(); } } function MoveText3() { Text3.visibility = "visible"; Text3.left = NowLeft; Text3.top = NowTop; NowLeft = NowLeft + 10; NowTop = NowTop - 5; if(NowLeft < (BodyWidth - LayerWidth) / 2 + 50 ) MoveText3ID = setTimeout("MoveText3()",50); else { clearTimeout(MoveText3ID); NowLeft = (BodyWidth - LayerWidth) / 2 + 200; NowTop = (BodyHeight - LayerHeight) / 2 + 115; MoveText4(); } } function MoveText4() { Text4.visibility = "visible"; Text4.left = NowLeft; Text4.top = NowTop; NowLeft = NowLeft - 5; NowTop = NowTop - 2; if(NowLeft > (BodyWidth - LayerWidth) / 2 + 150 ) MoveText4ID = setTimeout("MoveText4()",50); else { clearTimeout(MoveText4ID); Fade(); } } function Fade() { var BackX = Math.random()*10; var BackY = Math.random()*5; if(Count<=50) { if(Math.random()<0.5) { BackX = -BackX; BackY = -BackY; } Title1.visibility = "visible"; Title2.visibility = "visible"; Title2.left = parseInt(Title1.left) + BackX; Title2.top = parseInt(Title1.top) + BackY; FadeID = setTimeout("Fade()",50); Count++; } else { Text1.visibility = "hidden"; Text2.visibility = "hidden"; Text3.visibility = "hidden"; Text4.visibility = "hidden"; Title1.visibility = "hidden"; Title2.visibility = "hidden"; clearTimeout(FadeID); setInterval("Last()",10); } } function Last() { var ColorHex = ColorIndex.charAt(Bright); ColorHex = ColorHex + ColorHex + ColorHex + ColorHex + ColorHex + ColorHex; if(IsIE4) Add.visibility = "visible"; Now.visibility = "visible"; Entry.visibility = "visible"; for (i=0;i<Pos.length;i++) Circle[i].visibility = "visible"; Title3.visibility = "visible"; if(IsIE4) { Title3.color = ColorHex; if(Bright >= 17) Brightfold = false; if(Bright <= 0) Brightfold = true; if(Brightfold) Bright++; else Bright--; } for(i=0;i<Pos.length;i++) { Pos[i] = Pos[i] - Inc; Circle[i].left = Radius*Math.cos(Pos[i]) + CenterX - 5; Circle[i].top = Radius*Math.sin(Pos[i]) + CenterY - 5; } } </SCRIPT>
提示:您可以先修改部分代码再运行
录入:
any1225
【
评论
】 【
推荐
】 【
打印
】
上一篇:
网页间转换时加入效果
下一篇:
屏蔽鼠标代码
相关新闻
特效代码
收集的精典代码
(03:24)
收藏的网页特效
(03:24)
HTML代码转换成JS脚本
(03:24)
用css实现文字竖排显示
(03:24)
屏蔽鼠标代码
(03:24)
本文评论
全部评论
发表评论
点评:
字数
姓名:
尊重网上道德,遵守中华人民共和国的各项有关法律法规
承担一切因您的行为而直接或间接导致的民事或刑事法律责任
本站管理人员有权保留或删除其管辖留言中的任意内容
本站有权在网站内转载或引用您的评论
参与本评论即表明您已经阅读并接受上述条款
爱
网
页
#
爱
上
做
网
页
的
快
乐
不支持Flash
本周热门新闻
用css实现文字竖排显示
几个简单的网页页面特效代码(四)
收集的精典代码
几个简单的网页页面特效代码(三)
特殊标签fieldset实现的表中表效果
网站Flash对联广告源代码
仿MSN右下角弹出广告代码并自动消失
几个简单的网页页面特效-自动刷新网页
几个简单的网页页面特效代码(一)
背景图片居中显示(HTML,CSS技巧)
经典推荐
|
关于本站
|
公司招聘
|
广告服务
|
网站合作
|
用户反馈
|
联系方式
|
加入收藏
|
网站地图
|
简
繁
默
Copyright ©
秦皇岛网奇网络科技有限公司
冀ICP备05008592号
iwms
4.5