首页 - 业界新闻 - 新手上网 - 网页制作 - 网络编程 - 网站运营 - 网络营销 - 动画制作 - 图形图像 - 特效代码 - 网页素材 - 视频教程 - 资源下载 - 酷站赏析 - 免费模板
不支持Flash
首页特效代码
搜索: 标题内容作者
阅读新闻

收藏的网页特效

[日期:2007-03-24] 来源:  作者: [字体: ]
收藏本站<span style="CURSOR: hand" onClick="window.external.addFavorite('http://ync123.go.51.net','linux点点难题')" title="linux点点难题">收藏本站</span>
设为首页
<span onclick="var
strHref=window.location.href;this.style.behavior='url(#default#homepage)';this.setHomePage('http://ync123.go.51.net');" style="CURSOR: hand">设为首页</span>

  有时候看着那超链接的下划线挺讨厌的,把下面这段代码放到网页源代码<head>与</head>之间,下划线就无影无踪啦!
注意,网页的<body>标签里不能再有link之类的属性,否则本效果会失效!  
 <style TYPE="text/css">
<!--
A:link{text-decoration:none}
A:visited{text-decoration:none}
A:hover {color: #ff00ff;text-decoration:underline}
 -->
</style>
    自动刷新网页
在HTML的与之间加入下面这段代码,则在5分钟之后正在浏览的页面将会自动变为target.html这一页。代码中300为刷新的延迟时间,以秒为单位。targer.html为你想转向的目标页,若为本页则为自动刷新本页。
<meta http-equiv="refresh" content="300; url=target.html">
    刷新本页
点击即可刷新本页。
<a href="javascript:location.reload()" target="_self">刷新</a>
    点击即可返回到上一页面。
<a href="javascript:history.back(-1)">返回上一页</a>
    在打开有下面这段代码的页面时将会跳出一个468x60大小的小窗口。“window.html”为跳出的小窗口里所要显示的网页。toolbar、 status、menubar、scrollbars、设置小窗口的工具栏、状态栏、菜单栏及滚动条的有无,resizable设置是否可让浏览者改变小窗口大小,width、height设置小窗口的宽度以及高度。(不过这样的小窗口一般是不受欢迎的哦!)
<script language="javascript">
window.open("window.htm","toolbar=no, status=no,menubar=no, scrollbars=no,resizable=no,width=468,height=70,left=200,top=50");
</script>

    注意看跳出的那个窗口……它将在10秒钟之后自动关闭 
<script language="javascript">
<!--
function clock(){i=i-1
document.title="本窗口将在"+i+"秒后自动关闭!";
if(i>0)setTimeout("clock();",1000);
else self.close();}
var i=20
clock();
//-->
</script>
    浏览器的状态栏里出现一个字接一个字往左跑的欢迎语!
<script language="javascript">
<!--
function statusMessageObject(p,d) {
this.msg = MESSAGE
this.out = " "
this.pos = POSITION
this.delay = DELAY
this.i = 0
this.reset = clearMessage
}
function clearMessage() {
this.pos = POSITION
}
var POSITION = 100
var DELAY = 5
var MESSAGE = "欢迎光临! Welcome to WWW.daobaoku.com "
var scroll = new statusMessageObject()
function scroller() {
for (scroll.i = 0; scroll.i < scroll.pos; scroll.i++) {
scroll.out += " "
}
if (scroll.pos >= 0)
scroll.out += scroll.msg
else scroll.out = scroll.msg.substring(-scroll.pos,scroll.msg.length)
window.status = scroll.out
scroll.out = " "
scroll.pos--
if (scroll.pos < -(scroll.msg.length)) {
scroll.reset()
}
setTimeout ('scroller()',scroll.delay)
}
function snapIn(jumpSpaces,position) {
var msg = scroll.msg
var out = ""
for (var i=0; i<position; i++)
{out += msg.charAt(i)}
for (i=1;i<jumpSpaces;i++)
{out += " "}
out += msg.charAt(position)
window.status = out
if (jumpSpaces <= 1) {
position++
if (msg.charAt(position) == ' ')
{position++ }
jumpSpaces = 100-position
} else if (jumpSpaces > 3)
{jumpSpaces *= .75}
else
{jumpSpaces--}
if (position != msg.length) {
var cmd = "snapIn(" + jumpSpaces + "," + position + ")";
scrollID = window.setTimeout(cmd,scroll.delay);
} else {
window.status=""
jumpSpaces=0
position=0
cmd = "snapIn(" + jumpSpaces + "," + position + ")";
scrollID = window.setTimeout(cmd,scroll.delay);
return false
}
return true
}
snapIn(100,0);
// -->
</script>
     有些人真是懒得可以,把别人做好的网页往自己网页的框架(Frame)里一放,别人的成果就变成了自己的,而且看不出该网页的真实地址!为了防止你的成果被这些人所剽窃,你就可以在你网页的HTML里加入下面这段代码,这样,你的网页便总是在整个窗口中打开了。
<Script LANGUAGE="javascript">
if(self!=top){top.location=self.location;}
</script>
   

检测访问来源:检测访客来自哪里

 
效果演示 你来自:
http://www.dabaoku.com/texiao/2tishi/index.htm
把如下代码加入<body>区域中:
你来自:<BR><FONT COLOR="BLUE">
<SCRIPT LANGUAGE="javascript">
var where = document.referrer
if (where == '') { document.write("a bookmark or by typing in my URL") }
else { document.write(where) }
</SCRIPT>
</FONT>
礼花背景:深隧的天空不断爆出多彩的礼花,漂亮极了
 把如下代码加入<body>区域中
<layer name="a0" left=10 top=10 visibility=show bgcolor="#ffffff" clip="0,0,1,1"></layer>
<layer name="a1" left=10 top=10 visibility=show bgcolor="#fff000" clip="0,0,1,1"></layer>
<layer name="a2" left=10 top=10 visibility=show bgcolor="#ffa000" clip="0,0,1,1"></layer>
<layer name="a3" left=10 top=10 visibility=show bgcolor="#ff00ff" clip="0,0,1,1"></layer>
<layer name="a4" left=10 top=10 visibility=show bgcolor="#00ff00" clip="0,0,1,1"></layer>
<layer name="a5" left=10 top=10 visibility=show bgcolor="#ff00ff" clip="0,0,1,1"></layer>
<layer name="a6" left=10 top=10 visibility=show bgcolor="#ff0000" clip="0,0,1,1"></layer>
<layer name="a7" left=10 top=10 visibility=show bgcolor="#ffffff" clip="0,0,1,1"></layer>
<layer name="a8" left=10 top=10 visibility=show bgcolor="#fff000" clip="0,0,1,1"></layer>
<layer name="a9" left=10 top=10 visibility=show bgcolor="#ffa000" clip="0,0,1,1"></layer>
<layer name="a10" left=10 top=10 visibility=show bgcolor="#ff00ff" clip="0,0,1,1"></layer>
<layer name="a11" left=10 top=10 visibility=show bgcolor="#00ff00" clip="0,0,2,2"></layer>
<layer name="a12" left=10 top=10 visibility=show bgcolor="#0000ff" clip="0,0,2,2"></layer>
<layer name="a13" left=10 top=10 visibility=show bgcolor="#ff0000" clip="0,0,2,2"></layer>
<div id="starsDiv" style="position:absolute;top:0px;left:0px">
<div style="position:relative;width:2px;height:2px;background:#ffffff;font-size:2px"></div>
<div style="position:relative;width:1px;height:1px;background:#fff000;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#ffa000;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#ff00ff;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#00ff00;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#0000ff;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#FF0000;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#ffffff;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#fff000;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#ffa000;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#ff00ff;font-size:1px"></div>
<div style="position:relative;width:2px;height:2px;background:#ff00ff;font-size:2px"></div>
<div style="position:relative;width:1px;height:1px;background:#0000ff;font-size:1px"></div>
<div style="position:relative;width:1px;height:1px;background:#FF0000;font-size:1px"></div>
</div>

<SCRIPT LANGUAGE="javascript">

<!-- Begin
var Clrs = new Array(9);
Clrs[0] = 'ff0000';
Clrs[1] = '00ff00';
Clrs[2] = '000aff';
Clrs[3] = 'ff00ff';
Clrs[4] = 'ffa500';
Clrs[5] = 'ffff00';
Clrs[6] = '00ff00';
Clrs[7] = 'ffffff';
Clrs[8] = 'fffff0';
var sClrs = new Array(5);
sClrs[0] = 'ffa500';
sClrs[1] = '55ff66';
sClrs[2] = 'AC9DFC';
sClrs[3] = 'fff000';
sClrs[4] = 'fffff0';
var yBase;
var xBase;
var step;
var currStep = 0;
var Xpos = 1;
var Ypos = 1;
var initialStarColor = 'ffa000';
var Mtop = 250;
var Mleft = 250;
function Fireworks() {
if (document.all) {
yBase = window.document.body.offsetHeight / 3;
xBase = window.document.body.offsetWidth / 8;
}
else if (document.layers) {
yBase = window.innerHeight / 3;
xBase = window.innerWidth / 8;
}
if (document.all) {
step = 5;
for ( i = 0 ; i < starsDiv.all.length ; i++ ) {
for (ai = 0; ai < Clrs.length; ai++) {
var c = Math.round(Math.random()*[ai]);
}
if (currStep < 90)
starsDiv.all[i].style.background=initialStarColor;
if (currStep > 90)
starsDiv.all[i].style.background=Clrs[c];
starsDiv.all[i].style.top = Mtop + yBase*Math.sin((currStep+i*5)/3)*Math.sin(550+currStep/100)
starsDiv.all[i].style.left = Mleft + yBase*Math.cos((currStep+i*5)/3)*Math.sin(550+currStep/100)
}
}
else if (document.layers) {
step = 5;
for ( j = 0 ; j < 24 ; j++ ) { //number of NS layers!
var templayer = "a"+j;
for (ai = 0; ai < Clrs.length; ai++) {
var c = Math.round(Math.random()*[ai]);
}
if (currStep < 90)
document.layers[templayer].bgColor=initialStarColor;
if (currStep > 90)
document.layers[templayer].bgColor=Clrs[c];
document.layers[templayer].top = Mtop + yBase*Math.sin((currStep+j*5)/3)*Math.sin(550+currStep/100)
document.layers[templayer].left = Mleft + yBase*Math.cos((currStep+j*5)/3)*Math.sin(550+currStep/100)
}
}
currStep+= step;
T=setTimeout("Fireworks()",5);
if (currStep == 220) {
currStep = -10;
for (n = 0; n < sClrs.length; n++) {
var k = Math.round(Math.random()*n);
}
initialStarColor = sClrs[k];
if (document.all) {
Dtop = window.document.body.clientHeight - 250;
Dleft = xBase * 3.5;
Mtop = Math.round(Math.random()*Dtop);
Mleft = Math.round(Math.random()*Dleft);
document.all.starsDiv.style.top = Mtop+document.body.scrollTop;
document.all.starsDiv.style.left = Mleft+document.body.scrollLeft;
}
else if (document.layers) {
Dleft = window.innerWidth - 100;
Dtop = window.innerHeight - 100;
Mtop = Math.round(Math.random()*Dtop+window.pageYOffset);
Mleft = Math.round(Math.random()*Dleft+window.pageXOffset);
document.layers[templayer].top = Mtop;
document.layers[templayer].left = Mleft;
}
if ((Mtop < 20) || (Mleft < 20)) {
Mtop += 90;
Mleft += 90;
}
}
}
Fireworks();
// End -->
</script>
鼠标旋转效果:跟随鼠标的星星点点,变化过程非常漂亮,你一定会喜欢的
以把如下代码加入<body>区域中
<LAYER NAME="a0" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF0000" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a1" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF8000" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a2" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FFFF00" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a3" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#00FF00" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a4" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#0000FF" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a5" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF00FF" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a6" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FFFFFF" CLIP="0,0,2,2"></LAYER>

<div id="starsDiv" style="position:absolute;top:0px;left:0px">
<div style="position:relative;width:2px;height:2px;background:#ffffff;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#ffff00;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#ffa000;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#ff0000;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#00ff00;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#0000ff;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#FF00FF;font-size:2px;visibility:visible"></div>
</div>

<script language="javascript">
<!-- Script adapted for Explorer by kurt.grigg@virgin.net
if (document.layers)
{window.captureEvents(Event.MOUSEMOVE);}
var yBase = 200;
var xBase = 200;
var step = .2;
var currStep = 0;
var Xpos = 1;
var Ypos = 1;
var i = 0;
var j = 0;
if (document.all)
{
function MoveHandler(){
Xpos = document.body.scrollLeft+event.x;
Ypos = document.body.scrollTop+event.y;
}
document.onmousemove = MoveHandler;
}
else if (document.layers)
{
function xMoveHandler(evnt){
Xpos = evnt.pageX;
Ypos = evnt.pageY;
}
window.onMouseMove = xMoveHandler;
}
function animateLogo(){
if (document.all)
{
yBase = window.document.body.offsetHeight/4;
xBase = window.document.body.offsetWidth/4;
}
else if (document.layers)
{
yBase = window.innerHeight/4;
xBase = window.innerWidth/4;
}

if (document.all)
{
for ( i = 0 ; i < starsDiv.all.length ; i++ )
{
starsDiv.all[i].style.top = Ypos + Math.cos((20*Math.sin(currStep/20))+i*70)*yBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep + i*25)/10);
starsDiv.all[i].style.left = Xpos + Math.sin((20*Math.sin(currStep/20))+i*70)*xBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep + i*25)/10);
}
}

else if (document.layers)
{
for ( j = 0 ; j < 7 ; j++ ) //7 is number of NS layers!
{
var templayer="a"+j
document.layers[templayer].top = Ypos + Math.cos((20*Math.sin(currStep/20))+j*70)*yBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep + j*25)/10);
document.layers[templayer].left =Xpos + Math.sin((20*Math.sin(currStep/20))+j*70)*xBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep + j*25)/10);
}
}
currStep += step;
setTimeout("animateLogo()", 10);
}
animateLogo();
// -->
</script>
绕鼠标旋转的流星:一串流星绕鼠标旋转,效果真的很爽
以下是源代码:

<script language=javascript>

/*
Magic Wand cursor II (By Kurt at kurt.grigg@virgin.net)
Modified and permission granted to Dynamic Drive to feature script in archive
For full source, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
*/

if (document.all){
with (document){
write('<div id="starsDiv" style="position:absolute;top:0px;left:0px">')
write('<div style="position:relative;width:1px;height:1px;background:#6699CC;font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#6699CC;font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#6699CC;font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#6699CC;font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#6699CC;font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#6699CC;font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#6699CC;font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#6699CC;font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#6699CC;font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#6699CC;font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#6699CC;font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#6699CC;font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#6699CC;font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:3px;height:3px;background:#6699CC;font-size:3px;visibility:visible"></div>')
write('</div>')
}
}

if (document.layers)
{window.captureEvents(Event.MOUSEMOVE);}
var yBase = 200;
var xBase = 200;
var step = 1;
var currStep = 0;
var Xpos = 1;
var Ypos = 1;

if (document.all)
{
function MoveHandler(){
Xpos = document.body.scrollLeft+event.x;
Ypos = document.body.scrollTop+event.y;
}
document.onmousemove = MoveHandler;
}

else if (document.layers)
{
function xMoveHandler(evnt){
Xpos = evnt.pageX;
Ypos = evnt.pageY;
}
window.onMouseMove = xMoveHandler;
}

function animateLogo() {
if (document.all)
{
yBase = window.document.body.offsetHeight/6;
xBase = window.document.body.offsetWidth/6;
}
else if (document.layers)
{
yBase = window.innerHeight/8;
xBase = window.innerWidth/8;
}

if (document.all)
{
for ( i = 0 ; i < starsDiv.all.length ; i++ )
{
starsDiv.all[i].style.top = Ypos + yBase*Math.sin((currStep + i*4)/12)*Math.cos(400+currStep/200);
starsDiv.all[i].style.left = Xpos + xBase*Math.sin((currStep + i*3)/10)*Math.sin(currStep/200);
}
}

else if (document.layers)
{
for ( j = 0 ; j < 14 ; j++ ) //number of NS layers!
{
var templayer="a"+j
document.layers[templayer].top = Ypos + yBase*Math.sin((currStep + j*4)/12)*Math.cos(400+currStep/200);
document.layers[templayer].left = Xpos + xBase*Math.sin((currStep + j*3)/10)*Math.sin(currStep/200);
}
}
currStep+= step;
setTimeout("animateLogo()", 10);
}
animateLogo();
</script>

带时钟的台历:一个非常非常漂亮的仿真电子台历,不用可惜
第一步:把如下代码加入<head>区域中:
<STYLE>A.menuitem {
COLOR: menutext; TEXT-DECORATION: none
}
A.menuitem:hover {
COLOR: highlighttext; BACKGROUND-COLOR: highlight
}
DIV.contextmenu {
BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; Z-INDEX: 999; VISIBILITY: hidden; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset; POSITION: absolute; BACKGROUND-COLOR: buttonface
}
</STYLE>

第二步:把如下代码加入<body>区域中:
<STYLE>A.menuitem {
COLOR: menutext; TEXT-DECORATION: none
}
A.menuitem:hover {
COLOR: highlighttext; BACKGROUND-COLOR: highlight
}
DIV.contextmenu {
BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; Z-INDEX: 999; VISIBILITY: hidden; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset; POSITION: absolute; BACKGROUND-COLOR: buttonface
}</P><P></STYLE>
<SCRIPT language=javascript>
function Year_Month(){
var now = new Date();
var yy = now.getYear();
var mm = now.getMonth()+1;
var cl = '<font color="#0000df">';
if (now.getDay() == 0) cl = '<font color="#c00000">';
if (now.getDay() == 6) cl = '<font color="#00c000">';
return(cl + yy + '年' + mm + '月</font>'); }
function Date_of_Today(){
var now = new Date();
var cl = '<font color="#ff0000">';
if (now.getDay() == 0) cl = '<font color="#c00000">';
if (now.getDay() == 6) cl = '<font color="#00c000">';
return(cl + now.getDate() + '</font>'); }
function Day_of_Today(){
var day = new Array();
day[0] = "星期日";
day[1] = "星期一";
day[2] = "星期二";
day[3] = "星期三";
day[4] = "星期四";
day[5] = "星期五";
day[6] = "星期六";
var now = new Date();
var cl = '<font color="#0000df">';
if (now.getDay() == 0) cl = '<font color="#c00000">';
if (now.getDay() == 6) cl = '<font color="#00c000">';
return(cl + day[now.getDay()] + '</font>'); }
function CurentTime(){
var now = new Date();
var hh = now.getHours();
var mm = now.getMinutes();
var ss = now.getTime() % 60000;
ss = (ss - (ss % 1000)) / 1000;
var clock = hh+':';
if (mm < 10) clock += '0';
clock += mm+':';
if (ss < 10) clock += '0';
clock += ss;
return(clock); }
function refreshCalendarClock(){
document.all.calendarClock1.innerHTML = Year_Month();
document.all.calendarClock2.innerHTML = Date_of_Today();
document.all.calendarClock3.innerHTML = Day_of_Today();
document.all.calendarClock4.innerHTML = CurentTime(); }
var webUrl = webUrl;
document.write('<table border="0" cellpadding="0" cellspacing="0"><tr><td>');
document.write('<table id="CalendarClockFreeCode" border="0" cellpadding="0" cellspacing="0" width="60" height="70" ');
document.write('style="position:absolute;visibility:hidden" bgcolor="#eeeeee">');
document.write('<tr><td align="center"><font ');
document.write('style="cursor:hand;color:#ff0000;font-family:宋体;font-size:14pt;line-height:120%" ');
if (webUrl != 'netflower'){
document.write('</td></tr><tr><td align="center"><font ');
document.write('style="cursor:hand;color:#2000ff;font-family:宋体;font-size:9pt;line-height:110%" ');
}
document.write('</td></tr></table>');
document.write('<table border="0" cellpadding="0" cellspacing="0" width="61" bgcolor="#C0C0C0" height="70">');
document.write('<tr><td valign="top" width="100%" height="100%">');
document.write('<table border="1" cellpadding="0" cellspacing="0" width="58" bgcolor="#FEFEEF" height="67">');
document.write('<tr><td align="center" width="100%" height="100%" >');
document.write('<font id="calendarClock1" style="font-family:宋体;font-size:7pt;line-height:120%"> </font><br>');
document.write('<font id="calendarClock2" style="color:#ff0000;font-family:Arial;font-size:14pt;line-height:120%"> </font><br>');
document.write('<font id="calendarClock3" style="font-family:宋体;font-size:9pt;line-height:120%"> </font><br>');
document.write('<font id="calendarClock4" style="color:#100080;font-family:宋体;font-size:8pt;line-height:120%"> <b> </b></font>');
document.write('</td></tr></table>');
document.write('</td></tr></table>');
document.write('</td></tr></table>');
setInterval('refreshCalendarClock()',1000);
</SCRIPT>
非常酷的手表:一个真正的手表,指针是用内嵌函数做成的,非常酷
脚本说明:
第一步:把如下代码加入<body>区域中
<SCRIPT language=javascript>
<!-- Beginning of javascript -

var now

var second
var minute
var hour

var degreeSecond
var degreeMinute
var degreeHour

var timer
var stepDegree=6
var stepDegreeHour=30

function checkTime() {
if (document.all) {
now=new Date()
second=now.getSeconds()
minute=now.getMinutes()
hour=now.getHours()
if (hour>=12) {hour=hour-12}
spinIt()
timer=setTimeout("checkTime()",200)
}
}

function spinIt() {
window.status=hour
secondObj.SetIdentity()
minuteObj.SetIdentity()
hourObj.SetIdentity()

degreeSecond=180+stepDegree*second
degreeMinute=180+stepDegree*minute
degreeHour=180+stepDegreeHour*hour+(Math.floor(stepDegree*minute/12))

secondObj.Rotate(0,0,degreeSecond)
minuteObj.Rotate(0,0,degreeMinute)
hourObj.Rotate(0,0,degreeHour)
}

// - End of javascript - -->
</SCRIPT>
<DIV style="LEFT: 340px; POSITION: absolute; TOP: 100px">
<DIV style="LEFT: 0px; POSITION: absolute; TOP: 0px"><IMG height=102
src="../../images/bgclock.gif" width=100> </DIV>
<DIV style="LEFT: 0px; POSITION: absolute; TOP: 0px">
<OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 height=14
id=secondObj style="HEIGHT: 102px; WIDTH: 100px" width=14><PARAM NAME="HighQuality" VALUE="1"><PARAM NAME="Line0001" VALUE="SetFillStyle(1)"><PARAM NAME="Line0002" VALUE="SetLineColor(80,20,20)"><PARAM NAME="Line0003" VALUE="SetFillColor(80,20,20)"><PARAM NAME="Line0004" VALUE="Rect(0,0,1,32)"></OBJECT></DIV>
<DIV style="LEFT: 0px; POSITION: absolute; TOP: 0px">
<OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 height=14
id=minuteObj style="HEIGHT: 102px; WIDTH: 100px" width=14><PARAM NAME="HighQuality" VALUE="1"><PARAM NAME="Line0001" VALUE="SetFillStyle(1)"><PARAM NAME="Line0002" VALUE="SetLineColor(50,50,50)"><PARAM NAME="Line0003" VALUE="SetFillColor(50,50,50)"><PARAM NAME="Line0004" VALUE="Rect(0,0,1,30)"></OBJECT></DIV>
<DIV style="LEFT: 0px; POSITION: absolute; TOP: 0px">
<OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 height=14 id=hourObj
style="HEIGHT: 102px; WIDTH: 100px" width=14><PARAM NAME="HighQuality" VALUE="1"><PARAM NAME="Line0001" VALUE="SetFillStyle(1)"><PARAM NAME="Line0002" VALUE="SetLineColor(50,50,50)"><PARAM NAME="Line0003" VALUE="SetFillColor(50,50,50)"><PARAM NAME="Line0004" VALUE="Rect(0,0,1,16)"></OBJECT></DIV></DIV>
<DIV
style="COLOR: #444444; FONT-SIZE: 8pt; LEFT: 200px; LETTER-SPACING: 0.6em; LINE-HEIGHT: 200%; POSITION: absolute; TEXT-ALIGN: center; TOP: 20px; WIDTH: 200px; fomnt-family: Verdana"></DIV>

第二步:把<body>中的内容改为:
<BODY bgcolor="#fef4d9" onload=checkTime()>


录入:any1225

评论 】 【 推荐 】 【 打印
上一篇:HTML代码转换成JS脚本
下一篇:收集的精典代码
 
本文评论       全部评论
发表评论


点评: 字数
姓名:

  • 尊重网上道德,遵守中华人民共和国的各项有关法律法规
  • 承担一切因您的行为而直接或间接导致的民事或刑事法律责任
  • 本站管理人员有权保留或删除其管辖留言中的任意内容
  • 本站有权在网站内转载或引用您的评论
  • 参与本评论即表明您已经阅读并接受上述条款
 



#







不支持Flash
经典推荐
no pircture