网页特效代码

搜集的阿里西西的网页特效：

黑背景弹窗

<html>
<head>
<meta name="keywords" content="站长,网页特效,js特效,广告代码,zzjs,zzjs.net,sky,www.zzjs.net,站长特效网" />
<meta name="description" content="www.zzjs.net,站长特效网，站长必备js特效及广告代码。大量高质量js特效，提供高质量广告代码下载,尽在站长特效网" />
<title>漂亮的弹出窗口效果，zzjs.net收集，站长特效网欢迎您。</title>
<style>
.black_overlay{display:none;position:absolute;top:0%;left:0%;width:100%;height:100%;background-color: black;z-index:1001; -moz-opacity: 0.8;opacity:.80;filter:alpha(opacity=80);}
.www_zzjs_net {display:none;position:absolute;top:25%;left: 25%;width:50%;height:50%;padding:16px;border:16px solid orange;background-color: white;z-index:1002;overflow:auto;}
</style>
</head>
<body>
<a href="<#ZC_BLOG_HOST#>">站长特效网</a>,站长必备的高质量网页特效和广告代码。zzjs.net，站长js特效。<hr>

<a href="javascript:void(0)" onclick="document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">点击这里打开窗口</a>

<div id="light" class="www_zzjs_net">
welcome to www.zzjs.net
站长特效网，打造国内最帅的网页特效站。
<a href="javascript:void(0)" onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">
Close</a></div>
<div id="fade" class="black_overlay">
</div>
</body>
</html>

——————————————————————————————
载入

<html>
<head>
<title>正在载入...阿里西西loading测试中。</title>
<meta http-equiv="Content-Type" c>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0">
<table border=0 cellpadding=0 cellspacing=0 width="100%" height="100%">
<tr>
<form name=loading>
<td align=center>
<p><font color=gray>正在载入，请稍候.......</font></p>
<p>
<input type=text name=chart size=46 style="font-family:Arial;
font-weight:bolder; color:gray;
background-color:white; padding:0px; border-style:none;">
<br>
<input type=text name=percent size=46 style="font-family:Arial;
color:gray; text-align:center;
border-width:medium; border-style:none;">
<script>var bar = 0
var line = "||"
var amount ="||"
count()
function count(){
bar= bar+2
amount =amount + line
document.loading.chart.value=amount
document.loading.percent.value=bar+"%"
if (bar<99)
{setTimeout("count()",100);}
else
{window.location = "http://www.alixixi.com/";}
}
</script>
</p>
</td>
</form>
</tr>
</table>
</body>
</html>

————————————————————————————
进度条


<form name=loading>
<p align=center> <font color="#0066ff" size="2" face="Arial">载入中，请稍等...</font>

<input type=text name=chart size=46 style="font-family:Arial; font-weight:bolder; color:#0066ff; background-color:#fef4d9; padding:0px; border-style:none;">


<input type=text name=percent size=47 style="color:#0066ff; text-align:center; border-width:medium; border-style:none;">
<script>
var bar=0
var line="||"
var amount="||"
count()
function count(){
bar=bar+2
amount =amount + line
document.loading.chart.value=amount
document.loading.percent.value=bar+"%"
if (bar<99)
{setTimeout("count()",100);}
else
{window.location = "http://www.alixixi.com";}
}</script>


</form>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

————————————————————————————
窗口冲上边掉下来

脚本说明:
把如下代码加入<body>区域中
<script language="JavaScript1.2">

var ie=document.all
var dom=document.getElementById
var ns4=document.layers

var bouncelimit=32 //(must be divisible by 8)
var curtop
var direction="up"
var boxheight=''

function initbox(){
if (!dom&&!ie&&!ns4)
return
crossobj=(dom)?document.getElementById("dropin").style : ie? document.all.dropin : document.dropin
scroll_top=(ie)? document.body.scrollTop : window.pageYOffset
crossobj.top=scroll_top-250
crossobj.visibility=(dom||ie)? "visible" : "show"
dropstart=setInterval("dropin()",50)
}

function dropin(){
scroll_top=(ie)? document.body.scrollTop : window.pageYOffset
if (parseInt(crossobj.top)<100+scroll_top)
crossobj.top=parseInt(crossobj.top)+40
else{
clearInterval(dropstart)
bouncestart=setInterval("bouncein()",50)
}
}

function bouncein(){
crossobj.top=parseInt(crossobj.top)-bouncelimit
if (bouncelimit<0)
bouncelimit+=8
bouncelimit=bouncelimit*-1
if (bouncelimit==0){
clearInterval(bouncestart)
}
}

function dismissbox(){
if (window.bouncestart) clearInterval(bouncestart)
crossobj.visibility="hidden"
}

window.onload=initbox

</script>
<div id="dropin" style="position:absolute;visibility:hidden;left:250;top:100;width:500;height:300;background-color:#F5F5F5">

<div align="right"><a href="javascript:dismissbox()">[关闭窗口] </a></div>这是从上面掉下来的窗口，没吓着您吧，哈哈...

</div>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

————————————————————————————————
锁定

脚本说明:
把如下代码加入<body>区域中
<script language="JavaScript1.2">

var dragswitch=0
var nsx
var nsy
var nstemp

function drag_dropns(name){
temp=eval(name)
temp.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP)
temp.onmousedown=gons
temp.onmousemove=dragns
temp.onmouseup=stopns
}

function gons(e){
temp.captureEvents(Event.MOUSEMOVE)
nsx=e.x
nsy=e.y
}
function dragns(e){
if (dragswitch==1){
temp.moveBy(e.x-nsx,e.y-nsy)
return false
}
}

function stopns(){
temp.releaseEvents(Event.MOUSEMOVE)
}

//drag drop function for IE 4+////
/////////////////////////////////

var dragapproved=false

function drag_dropie(){
if (dragapproved==true){
document.all.showimage.style.pixelLeft=tempx+event.clientX-iex
document.all.showimage.style.pixelTop=tempy+event.clientY-iey
return false
}
}

function initializedragie(){
iex=event.clientX
iey=event.clientY
tempx=showimage.style.pixelLeft
tempy=showimage.style.pixelTop
dragapproved=true
document.onmousemove=drag_dropie
}

if (document.all){
document.onmouseup=new Function("dragapproved=false")
}

////drag drop functions end here//////

function hidebox(){
if (document.all)
showimage.style.visibility="hidden"
else if (document.layers)
document.showimage.visibility="hide"
}

</script>
<div id="showimage" style="position:absolute;width:250px;left:250;top:250">
<table border="0" width="250" bgcolor="#000080" cellspacing="0" cellpadding="2">
<tr>
<td width="100%"><table border="0" width="100%" cellspacing="0" cellpadding="0"
height="36">
<tr>
<td onMousedown="initializedragie()" style="cursor:hand" width="100%"><ilayer width="100%" onSelectStart="return false"><layer width="100%" onMouseover="dragswitch=1;drag_dropns(showimage)" onMouseout="dragswitch=0"><font face="Verdana"
color="#FFFFFF"><strong><small>移动的层</small></strong></font></layer></ilayer></td>
<td style="cursor:hand"><a href="#" onClick="hidebox();return false"><img src="http://img.alixixi.com/li01.gif" width="16"
height="14" border=0 onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a></td>
</tr>
<tr>
<td width="100%" bgcolor="#FFFFFF" style="padding:4px" colspan="2">
<small><strong><font face="Verdana">欢迎光临- <a
href="http://www.alixixi.com">阿里西西</a></font></strong></small>

<small><font face="Verdana">这里有超过1000种的你想要的各种代码，你一定会喜欢的!</font></small>
</td> </tr>
</table>
</td>
</tr>
</table>
</div>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————————
自动关闭

脚本说明:
把如下代码加入<body>区域中
<SCRIPT LANGUAGE="JavaScript1.2">
adTime=10; // seconds ad reminder is shown
chanceAd=1; // ad will be shown 1 in X times (put 1 for everytime)

var ns=(document.layers);
var ie=(document.all);
var w3=(document.getElementById && !ie);
adCount=0;
function initAd(){
if(!ns && !ie && !w3) return;
if(ie) adDiv=eval('document.all.sponsorAdDiv.style');
else if(ns) adDiv=eval('document.layers["sponsorAdDiv"]');
else if(w3) adDiv=eval('document.getElementById("sponsorAdDiv").style');
randAd=Math.ceil(Math.random()*chanceAd);
if (ie||w3)
adDiv.visibility="visible";
else
adDiv.visibility ="show";
if(randAd==1) showAd();
}
function showAd(){
if(adCount<adTime*10){adCount+=1;
if (ie){documentWidth =document.body.offsetWidth/2+document.body.scrollLeft-20;
documentHeight =document.body.offsetHeight/2+document.body.scrollTop-20;}
else if (ns){documentWidth=window.innerWidth/2+window.pageXOffset-20;
documentHeight=window.innerHeight/2+window.pageYOffset-20;}
else if (w3){documentWidth=self.innerWidth/2+window.pageXOffset-20;
documentHeight=self.innerHeight/2+window.pageYOffset-20;}
adDiv.left=documentWidth-200;adDiv.top =documentHeight-200;
setTimeout("showAd()",100);}else closeAd();
}
function closeAd(){
if (ie||w3)
adDiv.display="none";
else
adDiv.visibility ="hide";
}
onload=initAd;
//End-->
</script>
<div id="sponsorAdDiv" style="visibility:hidden">
<table bgcolor="#008000"><tr><td>
<table width="300" bgcolor="#F0FFF0"><tr><td align="center" valign="middle">
<b>网络编程站欢迎你的光临

请多提宝贵意见，谢谢

你的光临是对我们最大的支持.</b>

(这个显示区将在几秒钟内自动关闭)

</td></tr></table></td></tr></table>
</div>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————————————————

闪电效果

脚本说明:
把如下代码加入<body>区域中
<SCRIPT>


</SCRIPT>

<SCRIPT language=Javascript>

</SCRIPT>

第二步：把<body>中的内容改为：
<BODY bgcolor="#fef4d9"
onload=window.focus();init();
onresize=document.location.href=document.location.href; onunload=halt();>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

————————————————————————————
漫天飞雪

脚本说明:
第一步：把如下代码加入<body>区域中
<script language="JavaScript">

</script>

第二步：把<body>中的内容改为：
<body bgcolor=#000000" onLoad="snow()">

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————————————
进页面时信息框

要完成此效果把 onLoad="window.alert('欢迎光临2259网页特效\n\n本站拥有大量JavaScript源代码\n网址：http://free.alixixi.com\n')" 加在<body>标记里
例如：<body onLoad="window.alert('欢迎光临2259网页特效\n\n本站拥有大量JavaScript源代码\n网址：http://free.alixixi.com\n')">

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

————————————————————————————————————
倒计时

脚本说明：
第一步:把如下代码加入<head>区域中:
<META HTTP-EQUIV="REFRESH" CONTENT="11; URL=http://free.alixixi.com">

第二步:把<body>中加入如下代码：

<script language="JavaScript">

startday = new Date();
clockStart = startday.getTime();

function initStopwatch()
{
var myTime = new Date();
var timeNow = myTime.getTime();
var timeDiff = timeNow - clockStart;
this.diffSecs = timeDiff/1000;
return(this.diffSecs);
}

function getSecs()
{
var mySecs = initStopwatch();
var mySecs1 = ""+mySecs;
mySecs1= mySecs1.substring(0,mySecs1.indexOf(".")) + " secs.";
document.form1.timespent.value = mySecs1
window.setTimeout('getSecs()',1000);
}

</script>


<center>
This page will change in 10 seconds:
<form name=form1><input size=9 name=timespent></form>
</center>

第三步：把<body>中内容改为：
<body bgcolor="#fef4d9" onLoad="window.setTimeout('getSecs()',1)">

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————————
背景颜色改变

要完成此效果需要两个步骤

第一步：把如下代码加入到<head>区域中

<script language="Javascript">



</script>

第二步：把如下代码加入到<body>区域中

<form>
<div align="center">
<input type="button" value="改变背景" onClick="randombackground()">
</div>
</form>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————
显示系统时间

有什么问题请到<a href='/bbs/index.asp?boardid=2'>论坛</a>中发表<br>




<SCRIPT LANGUAGE="JavaScript">



</script>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

————————————————————————————
小心小心

有什么问题请到<a href='/bbs/index.asp?boardid=2'>论坛</a>中发表<br>


<SCRIPT LANGUAGE="JavaScript">



</SCRIPT>
<center>
下面的每一个按钮都很危险,一按你的电脑立即<font color=red>OVER</font>,不信试试吧!!!<br>

<FORM method=post name="FormAction" action="mailto:"+"[email protected]">

<INPUT TYPE="button" value="Exploding Windows"
Name="btnExplodeWindows" onClick="WindowBomb()"><P><br>

<INPUT TYPE="button" value="Annoying Button" Name="btnAnnoy"
onClick="AnnoyingButton()"><P><br>

<INPUT TYPE="button" value="Reload Bomb" Name="btnReload"
onClick="ReloadBomb()"><P><br>

<INPUT TYPE="button" value="While Loop Lock" Name="btnWhile"
onClick="WhileLoopLock()"><p><br>

<INPUT TYPE="button" value="Eat Memory In Time" Name="btnEatTime"
onClick="EatMemoryInTime()"><p><br>

<INPUT TYPE="button" value="Action!" onClick="document.FormAction.submit()"><br>
</center>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

）————————————————————————————

按钮实现粘贴复制

有什么问题请到<a href='/bbs/index.asp?boardid=2'>论坛</a>中发表<br>




<SCRIPT language=JavaScript>
function copy(ob){
var obj=findObj(ob); if (obj) {
obj.select();js=obj.createTextRange();js.execCommand("Copy");}
}
function cut(ob){
var obj=findObj(ob); if (obj) {
obj.select();js=obj.createTextRange();js.execCommand("Cut");}
}
function findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}
//-->
</SCRIPT>
<input type="button" name="Button" value="复制到剪贴板" onClick=copy('txtOutput')>
<input type="button" name="Button" value="剪贴到剪贴板" onClick=cut('txtOutput')>
<br><form name="fom1" method="post" action="">
<textarea name="txtOutput" rows="5" cols="50"> dfkghkldfghklsdjfhgklsdfhgklhsdfklghsdfklhj</textarea>
</form>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

————————————————————
文字晃动

有什么问题请到<a href='/bbs/index.asp?boardid=2'>论坛</a>中发表<br>




把下列代码粘贴到 <HEAD>

<head>
<style>
.jc{
position:relative;
}
</style>

<script language="JavaScript1.2">

var ns6=document.getElementById&&!document.all
var ie=document.all

var customcollect=new Array()
var i=0

function jiggleit(num){
if ((!document.all&&!document.getElementById)) return;
customcollect[num].style.left=(parseInt(customcollect[num].style.left)==-1)? customcollect[num].style.left=1 : customcollect[num].style.left=-1
}

function init(){
if (ie){
while (eval("document.all.jiggle"+i)!=null){
customcollect[i]= eval("document.all.jiggle"+i)
i++
}
}
else if (ns6){
while (document.getElementById("jiggle"+i)!=null){
customcollect[i]= document.getElementById("jiggle"+i)
i++
}
}

if (customcollect.length==1)
setInterval("jiggleit(0)",80)
else if (customcollect.length>1)
for (y=0;y<customcollect.length;y++){
var tempvariable='setInterval("jiggleit('+y+')",'+'100)'
eval(tempvariable)
}
}

window.onload=init

</script>

</head>

<span id="jiggle0" class="jc"><b>欢迎您访问阿里西西WEB开发 <a href="http://alixixi.com">JavaScript 教学!</a></b></span>

<br><br><br>
<p><font color=red>//网站:http://www.alixixi.com</font></p>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

-------------------------------------------______

文字飞入

有什么问题请到<a href='/bbs/index.asp?boardid=2'>论坛</a>中发表<br>



<html>
<head>
<title>阿里西西WEB开发-特效代码->>载入信息动画</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<style type="text/css">
.clDivs {position:absolute; width:30px; height:30px; left:0px; font-size:80px; font-weight:bold; font-family:arial black,arial,helvetica,sans-serif; color:#999999; visibility:hidden;}
</style>
<script language="JavaScript" type="text/javascript">
function lib_bwcheck(){
this.ver=navigator.appVersion
this.agent=navigator.userAgent
this.dom=document.getElementById?1:0
this.opera5=(navigator.userAgent.indexOf("Opera")>-1 && document.getElementById)?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;
this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;
this.ie4=(document.all && !this.dom && !this.opera5)?1:0;
this.ie=this.ie4||this.ie5||this.ie6
this.mac=this.agent.indexOf("Mac")>-1
this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)
return this
}
var bw=new lib_bwcheck()
numberOfLetters=13
ypos=-100

xpos=new Array()
xpos[0] = -380 //w
xpos[1] = -300 //w
xpos[2] = -220 //w
xpos[3] = -140 //.
xpos[4] = -110 //5
xpos[5] = -55 //1
xpos[6] = -5 //j
xpos[7] = 55 //s
xpos[8] = 115 //.
xpos[9] = 140 //c
xpos[10] = 200 //o
xpos[11] = 260 //m
xpos[12] = 320 //m

testing=0

animation=4

aspeed=10.

function makeObj(obj,speed,xmove,ymove,works){
this.el=bw.dom? document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?document.layers[obj]:0;
this.css=bw.dom || bw.ie4?this.el.style:bw.ns4?this.el:0;
this.moveIt=b_moveIt;
}

var px = bw.ns4||window.opera?"":"px";

function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x+px; this.css.top=this.y+px;}

var posArray,oZdivs;
function introInit(){
pageXcenter = bw.op5||bw.ns4 ||bw.ns6?innerWidth/2:document.body.offsetWidth/2
pageYcenter = bw.op5||bw.ns4||bw.ns6?innerHeight/2:document.body.offsetHeight/2
oZdivs = new Array()
for(var i=0; i<numberOfLetters; i++){
oZdivs[i] = new makeObj('div'+i)
oZdivs[i].moveIt(-200,0)
oZdivs[i].css.visibility = "visible"
}
if (animation==4) animation = Math.round(Math.random()*2)+1
if (!testing) eval('anim'+animation+'(0)')
else testIt()
}
function testIt(){
alert(pageYcenter)
for(var i=0; i<oZdivs.length; i++){
oZdivs[i].moveIt((pageXcenter+xpos[i]),(pageYcenter+ypos))
}
}

xPath1 = new Array(-277,-271,-264,-255,-245,-234,-223,-210,-196,-181,-161,-134,-98,-52,1,53,98,131,151,156,147,124,92,59,0)
yPath1 = new Array(-240,-206,-162,-114,-64,-16,29,71,112,151,187,217,241,255,260,254,239,213,179,143,108,77,51,30,0)
function anim1(num,test){
if (num<oZdivs.length){
st = test?test:0;
animX(num,'xPath1','yPath1',aspeed,st,'anim1('+(num+1)+','+st+')')
}else endanim(0)
}

xPath2 = new Array(-285,-270,-255,-240,-225,-210,-195,-180,-165,-150,-135,-120,-105,-90,-75,-60,-45,-30,-15,0)
yPath2 = new Array(-353,-344,-335,-324,-312,-299,-285,-270,-254,-236,-218,-198,-177,-155,-132,-108,-83,-56,-29,0)
function anim2(num){
if (num<oZdivs.length){
animX(num,'xPath2','yPath2',aspeed,0,'anim2('+(num+1)+')')
}else endanim(0)
}

xPath3 = new Array(0,-2,-6,-13,-23,-36,-50,-66,-83,-100,-117,-134,-150,-164,-177,-187,-194,-198,-200,-198,-194,-187,-177,-164,-150,-134,-117,-100,-83,-66,-50,-36,-23,-13,-6,-2,0)
yPath3 = new Array(0,-17,-34,-50,-64,-77,-87,-94,-98,-100,-98,-94,-87,-77,-64,-50,-34,-17,0,17,34,50,64,77,87,94,98,100,98,94,87,77,64,50,34,17,0)
function anim3(num){
if (num<oZdivs.length){
animX(num,'xPath3','yPath3',aspeed,0,'anim3('+(num+1)+')')
}else endanim(0)
}

function animX(divnum,arrayX,arrayY,speed,num,fn){
arrayXr = new Array(); arrayYr = new Array()
arrayXr = eval(arrayX); arrayYr = eval(arrayY)
arrayX = "'"+arrayX+"'"; arrayY = "'"+arrayY+"'"
if (num<arrayXr.length){
oZdivs[divnum].moveIt(arrayXr[num]+(pageXcenter+xpos[divnum]),arrayYr[num]+(pageYcenter+ypos))
num ++;
setTimeout("animX("+divnum+","+arrayX+","+arrayY+","+speed+","+num+",'"+fn+"')",speed)
}else eval(fn)
}

function endanim(num){
if (num<oZdivs.length){
oZdivs[num].css.visibility = "hidden"
num ++
setTimeout("endanim("+num+")",300)
}else{

}
}

onload = introInit;
</script>
</head>

<body bgcolor="#FFFFFF" text="#000000">
<div id="div0" class="clDivs" style="left: 23px; top: 137px">w</div>
<div id="div1" class="clDivs" style="left: 101px; top: 137px">w</div>
<div id="div2" class="clDivs" style="left: 183px; top: 137px">w</div>
<div id="div3" class="clDivs" style="left: 287px; top: 137px">.</div>
<div id="div4" class="clDivs" style="left: 351px; top: 139px">w</div>
<div id="div5" class="clDivs" style="left: 431px; top: 137px">e</div>
<div id="div6" class="clDivs" style="left: 489px; top: 113px">b</div>
<div id="div7" class="clDivs" style="left: 506px; top: 125px">j</div>
<div id="div8" class="clDivs" style="left: 573px; top: 135px">x</div>
<div id="div9" class="clDivs" style="left: 603px; top: 144px">.</div>
<div id="div10" class="clDivs" style="left: 656px; top: 141px">c</div>
<div id="div11" class="clDivs" style="left: 701px; top: 163px">o</div>
<div id="div12" class="clDivs" style="left: 701px; top: 163px">m</div>
</body>
</html>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————————————
弹窗


<head>
<SCRIPT language=javascript>
//more javascript from http://www.alixixi.com
window.onload = enetgetMsg;
window.onresize = enetresizeDiv;
window.onerror = function(){}
var enetdivTop,enetdivLeft,enetdivWidth,enetdivHeight,enetdocHeight,enetdocWidth,enetobjTimer,i = 0;
function enetgetMsg()
{
try{
enetdivTop = parseInt(document.getElementById("enetMeng").style.top,10)
enetdivLeft = parseInt(document.getElementById("enetMeng").style.left,10)
enetdivHeight = parseInt(document.getElementById("enetMeng").offsetHeight,10)
enetdivWidth = parseInt(document.getElementById("enetMeng").offsetWidth,10)
enetdocWidth = document.body.clientWidth;
enetdocHeight = document.body.clientHeight;
document.getElementById("enetMeng").style.top = parseInt(document.body.scrollTop,10) + enetdocHeight + 10;// enetdivHeight
document.getElementById("enetMeng").style.left = parseInt(document.body.scrollLeft,10) + enetdocWidth - enetdivWidth
document.getElementById("enetMeng").style.visibility="visible"
enetobjTimer = window.setInterval("enetmoveDiv()",10)
}
catch(e){}
}
　
function enetresizeDiv()
{
i+=1
if(i>600) enetcloseDiv()
try{
enetdivHeight = parseInt(document.getElementById("enetMeng").offsetHeight,10)
enetdivWidth = parseInt(document.getElementById("enetMeng").offsetWidth,10)
enetdocWidth = document.body.clientWidth;
enetdocHeight = document.body.clientHeight;
document.getElementById("enetMeng").style.top = enetdocHeight - enetdivHeight + parseInt(document.body.scrollTop,10)
document.getElementById("enetMeng").style.left = enetdocWidth - enetdivWidth + parseInt(document.body.scrollLeft,10)
}
catch(e){}
}
function enetmoveDiv()
{
try
{
if(parseInt(document.getElementById("enetMeng").style.top,10) <= (enetdocHeight - enetdivHeight + parseInt(document.body.scrollTop,10)))
{
window.clearInterval(enetobjTimer)
enetobjTimer = window.setInterval("enetresizeDiv()",1)
}
enetdivTop = parseInt(document.getElementById("enetMeng").style.top,10)
document.getElementById("enetMeng").style.top = enetdivTop - 1
}
catch(e){}
}
function enetcloseDiv()
{
document.getElementById('enetMeng').style.visibility='hidden';
if(enetobjTimer) window.clearInterval(enetobjTimer)
}
</SCRIPT>

<DIV id=enetMeng
style="BORDER-RIGHT: #455690 1px solid; BORDER-TOP: #a6b4cf 1px solid; Z-INDEX: 99999; LEFT: 0px; VISIBILITY: visible; BORDER-LEFT: #a6b4cf 1px solid; WIDTH: 241px; BORDER-BOTTOM: #455690 1px solid; POSITION: absolute; TOP: -200px; HEIGHT: 157px">
<TABLE WIDTH=255 BORDER=0 CELLPADDING=0 CELLSPACING=0 bgcolor="#DAE6FC">
<TR>

<TD height="30" valign="top" background="qqimages/heihei_1.jpg">
<table width="255" height="19" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="212" valign="bottom"><strong><font size="2">　<font color="#FF6600">消息框</font></font></strong></td>
<td width="43" style="cursor:hand" onClick="enetcloseDiv()">X</td>
</tr>
</table> </TD>
</TR>
<TR>
<TD height="122" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="1">
<tr>
<td width="95%"><table align="center" width="98%"><tr><td>
欢迎你来到阿里西西WEB开发http://www.alixixi.com</td><tr></table></td>
</tr>
</table> </TD>
</TR>
<TR>
<TD></TD>
</TR>
</TABLE></div>
<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————————
表格的收缩

<!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>www.alixixi.com</title>
<script language="javascript">
function tablecollapse()
{
/* Variables */
var collapseClass='footcollapse';
var collapsePic='http://img.alixixi.com/icon_indextool.gif';
var expandPic='http://img.alixixi.com/icon_indextool.gif';
var initialCollapse=true;

// loop through all tables
var t=document.getElementsByTagName('table');
var checktest= new RegExp("(^|\\s)" + collapseClass + "(\\s|$)");
for (var i=0;i<t.length;i++)
{
// if the table has not the right class, skip it
if(!checktest.test(t[i].className)){continue;}

// make the footer clickable
t[i].getElementsByTagName('tfoot')[0].onclick=function()
{
// loop through all bodies of this table and show or hide
// them
var tb=this.parentNode.getElementsByTagName('tbody');
for(var i=0;i<tb.length;i++)
{
tb[i].style.display=tb[i].style.display=='none'?'':'none';
}
// change the image accordingly
var li=this.getElementsByTagName('img')[0];
li.src=li.src.indexOf(collapsePic)==-1?collapsePic:expandPic;
}
// if the bodies should be collapsed initially, do so
if(initialCollapse)
{
var tb=t[i].getElementsByTagName('tbody');
for(var j=0;j<tb.length;j++)
{
tb[j].style.display='none';
}
}
// add the image surrounded by a dummy link to allow keyboard
// access to the last cell in the footer
var newa=document.createElement('a');
newa.href='#';
newa.onclick=function(){return false;}
var newimg=document.createElement('img');
newimg.src=initialCollapse?expandPic:collapsePic;
var tf=t[i].getElementsByTagName('tfoot')[0];
var lt=tf.getElementsByTagName('td')[tf.getElementsByTagName('td').length-1];
newa.appendChild(newimg);
lt.insertBefore(newa,lt.firstChild);
}
}
// run tablecollapse when the page loads
window.onload=tablecollapse;

</script>
<style type="text/css">
body{
font-family:Arial,Sans-Serif;
font-size:90%;
background:#cc9;
}
#boundary{
background:#f8f8f8;
padding:2em;
width:40em;
}
h1{
font-family:"Trebuchet MS",Sans-serif;
text-transform:uppercase;
color:#696;
font-size:120%;
}

table.footcollapse{
width:30em;
}
table.footcollapse caption{
font-size:120%;
text-transform:uppercase;
text-align:left;
padding:.5em 1em;
}
table.footcollapse th{
text-align:left;
}
table.footcollapse,table.footcollapse th,table.footcollapse th
{
border:none;
border-collapse:collapse;
}
table.footcollapse thead th
{
width:10em;
border-style:solid;
border-width:1px;
border-color:#cff #69c #69c #cff;
background:#9cf;
padding:2px 10px;
}
table.footcollapse tfoot th,
table.footcollapse tfoot td
{
border-style:solid;
border-width:1px;
border-color:#9cf #369 #369 #9cf;
background:#69c;
padding:2px 10px;
}
table.footcollapse tbody{
background:#ddd;
}
table.footcollapse tbody td{
padding:5px 10px;
border:1px solid #999;
}
table.footcollapse tbody th{
padding:2px 10px;
border:1px solid #999;
border-left:none;
}
table.footcollapse tbody tr.odd{
background:#ccc;
}

table.footcollapse tfoot td img{
border:none;
vertical-align:bottom;
padding-left:10px;
float:right;
}

</style>
</head>
<body>
<table summary="CDs I listened to recently" class="footcollapse">
<caption>My recent CDs</caption>
<thead>
<tr>
<th>Title</th>
<th>Artist</th>
<th>Quality</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Total</th>
<td colspan="2">5 CDs</td>
</tr>
</tfoot>
<tbody>
<tr>
<th>Front 242</th>
<td>Front By Front</td>
<td>Quite OK</td>
</tr>
<tr class="odd">
<th>Miss Kittin</th>
<td>i.com</td>
<td>good buy</td>
</tr>
<tr>
<th>Die Fantastischen Vier</th>
<td>Viel</td>
<td>Nice comeback</td>
</tr>
<tr class="odd">
<th>Nine Inch Nails</th>
<td>With Teeth</td>
<td>Oh yes, finally a new one</td>
</tr>
<tr>
<th>Garbage</th>
<td>Bleed like me</td>
<td>Needs more listening</td>
</tr>
</tbody>
</table>

<table summary="DVDs I watched recently" class="footcollapse">
<caption>My recent DVDs</caption>
<thead>
<tr>
<th>Title</th>
<th>Quality</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Total</th>
<td>5 DVDs</td>
</tr>
</tfoot>
<tbody>
<tr>
<th>Star Trek TNG Season 7</th>
<td>They lost it</td>
</tr>
<tr class="odd">
<th>Big Fish</th>
<td>Wonderful Tale</td>
</tr>
<tr>
<th>Closer</th>
<td>I want my time back!</td>
</tr>
<tr class="odd">
<th>Hot Shots</th>
<td>Always worth it</td>
</tr>
<tr>
<th>The Party</th>
<td>A shame there is not more Sellers</td>
</tr>
</tbody>
</table>
</body>
</html>
<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————————————————————

弹窗不停

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>阿里西西网页特效演示，很恶心的常见整人效果</title>
</head>

<body>

<a href="" onMouseover="alert('为什么把鼠标放到这里?');

alert('我不是说过不可以这样吗？');

alert('你把我的话当什么了？');

alert('你知道错了吗？');

alert('什么？你居然....');

alert('居然还没意识到自己做错了？');

alert('那好，你要为此付出代价!');

alert('我要你在这里点足一千下......');

alert('什么？你开始有点后悔了？');

alert('何必呢？');

alert('你当初干什么去了？');

alert('不原谅你！');

alert('好从现在开始再点995下......');

alert('你的手开始累了吗?');

alert('什么？你已经没力气了？');

alert('你一直在求我原谅你啊！');

alert('看来你是真的知道错了!');

alert('下次你还会这么做吗？');

alert('真的不会了？');

alert('那好，今天就放你一马！');

alert('写封信给我说声对不起!');

alert('你能这么做我很高兴!!!');

document.bgColor='black';

document.fgColor='White';

window.location.href='mailto:mygod@god?subject=对不起,下次不敢了!';">不许把鼠标移到这里</a>

嘻试吧爽噢。。

</body>

</html>
<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————

点击加入收藏家

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>阿里西西网页特效演示，点击加入收藏夹</title>
</head>

<body>

<a href="javascript:window.external.AddFavorite('http://linkweb.cn/js', '网页特效')">点击加入收藏夹</a>

</body>

</html>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

————————————————————————
自动消失

<html>
<head>
<title>阿里西西网页特效演示，重要信息说明脚本</title>
<style type="text/css">

</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<script language="javascript">
//显示的信息，可以使用HTML语法，注意引号用法，单套双。
var message='<b><font size=5 face=arial color=red><a href="#" target="_blank">请点击进入本站</a></font></b>'

//背景色
var backgroundcolor="#eeffee"

//0 代表信息永远显示，1 代表信息只显示一段时间，2为随机显示模式；
var displaymode=1

//如果显示模式为在指定时间内显示，输入时间段(1000为1秒)；
var displayduration=10000

//1代表闪烁，0代表不闪烁；
var flashmode=1
//如果设置了闪烁，输入闪烁的颜色；
var flashtocolor="lightgreen"

////下面不必修改///

function regenerate(){
window.location.reload()
}

var which=0

function regenerate2(){
if (document.layers)
setTimeout("window.onresize=regenerate",700)
}

function display2(){
if (document.layers){
if (topmsg.visibility=="show")
topmsg.visibility="hide"
else
topmsg.visibility="show"
}
else if (document.all){
if (topmsg.style.visibility=="visible")
topmsg.style.visibility="hidden"
else
topmsg.style.visibility="visible"
setTimeout("display2()",Math.round(Math.random()*10000)+10000)
}
}

function flash(){
if (which==0){
if (document.layers)
topmsg.bgColor=flashtocolor
else
topmsg.style.backgroundColor=flashtocolor
which=1
}
else{
if (document.layers)
topmsg.bgColor=backgroundcolor
else
topmsg.style.backgroundColor=backgroundcolor
which=0
}
}

if (document.all){
document.write('<span id="topmsg" style="position:absolute;visibility:hidden">'+message+'</span>')
}

function logoit(){
document.all.topmsg.style.left=document.body.scrollLeft+document.body.clientWidth/2-document.all.topmsg.offsetWidth/2
document.all.topmsg.style.top=document.body.scrollTop+document.body.clientHeight-document.all.topmsg.offsetHeight-4
}

function logoit2(){
topmsg.left=pageXOffset+window.innerWidth/2-topmsg.document.width/2
topmsg.top=pageYOffset+window.innerHeight-topmsg.document.height-5
setTimeout("logoit2()",90)
}

function setmessage(){
document.all.topmsg.style.left=document.body.scrollLeft+document.body.clientWidth/2-document.all.topmsg.offsetWidth/2
document.all.topmsg.style.top=document.body.scrollTop+document.body.clientHeight-document.all.topmsg.offsetHeight-4
document.all.topmsg.style.backgroundColor=backgroundcolor
document.all.topmsg.style.visibility="visible"
if (displaymode==1)
setTimeout("topmsg.style.visibility='hidden'",displayduration)
else if (displaymode==2)
display2()
if (flashmode==1)
setInterval("flash()",1000)
window.onscroll=logoit
window.onresize=new Function("window.location.reload()")
}

function setmessage2(){
topmsg=new Layer(window.innerWidth)
topmsg.bgColor=backgroundcolor
regenerate2()
topmsg.document.write(message)
topmsg.document.close()
logoit2()
topmsg.visibility="show"
if (displaymode==1)
setTimeout("topmsg.visibility='hide'",displayduration)
else if (displaymode==2)
display2()
if (flashmode==1)
setInterval("flash()",1000)
}

if (document.layers)
window.onload=setmessage2
else if (document.all)
window.onload=setmessage

</script>
<center>

<center>
<table border=1 bordercolor=#000000 borderlight=green style="border-collapse: collapse" cellpadding="0" cellspacing="0">
<tr><td align=center><font size=5 color=red face="Arial, Helvetica, sans-serif"><strong>下面为脚本显示区!</strong></font></td></tr><tr><td align=left height=110 width=240>下面的信息说明10秒后消失，你也可以设置更长时间或不消失.
</td></tr>
</table></center>

<center>
<SCRIPT LANGUAGE="JavaScript">



</script></center>

</body>
</html>
<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

——————————————————————————

猜你喜欢