搜集的阿里西西的网页特效:
黑背景弹窗
<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>
<!--欢迎来到站长特效网,我们网站收集大量高质量js特效,提供许多广告代码下载,网址:www.zzjs.net,zzjs@msn.com,用.net打造靓站-->
<a href="javascript:void(0)" οnclick="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)" οnclick="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>
————————————————————————————
进度条
<!--把如下代码加入到<head>区域中.注意:图片自选-->
<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.οnlοad=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.οnmοusedοwn=gons
temp.οnmοusemοve=dragns
temp.οnmοuseup=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.οnmοusemοve=drag_dropie
}
if (document.all){
document.οnmοuseup=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 οnlοad="return imgzoom(this,600);" οnclick="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";
}
οnlοad=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>
<!--
ie4=document.all?1:0;
ns4=document.layers?1:0;
ns5=(document.getElementById && !document.all)?1:0;
function init(){
// Bolt has an aura? (true | false) // takes twice as long to strike
aura=false;
bcolor="white";
acolor="blue";
// Make background color flash? (true | false)
flash=true;
skyNorm="black";
skyFlash="#000050";
if (flash) document.bgColor=skyNorm;
// nbs = Number of main bolt segments
nbs = 50;
ct=0;
// Font sizes for lightning bolt and aura segments
fsb=shi*.3;
fsf=shi*.2;
fsbi=shi*.2;
fsfi=shi*.12;
fsbii=shi*.12;
fsfii=shi*.07;
xpos=cswi; ypos=0;
if (ns5) ark = document.getElementById("ark");
if (ns4) {
ol=document.layers["ark"];
ol = new Layer(swi);
ol.left = 0;
ol.top = 0;
ol.height = shi;
ol.zIndex=1;
ol.visibility = "hide";
ret="<STYLE TYPE='text/css'>";
for (i=1;i<10;i++){
ret+="DIV.bolt"+i+" {position:absolute; font-style:'Times New Roman'; font-size:"+(fsf*i/9)+"px; color:"+bcolor+"; visibility:inherit; z-index:1}";
if (aura) ret+="DIV.bolta"+i+" {position:absolute; font-style:'Times New Roman'; font-size:"+(fsf*1.3*i/9)+"px; color:blue; visibility:inherit; z-index:0}";
} ret+="</STYLE>";
for (fs=1;fs<10;fs++)
for (i=1;i<nbs;i++) {
if (aura) ret+="<DIV id=a"+i+"f"+fs+" class=bolta"+fs+">.</DIV>";
ret+="<DIV id=s"+i+"f"+fs+" class=bolt"+fs+">.</DIV>";
}
//ol.document.open();
ol.document.write(ret);
ol.document.close();
}
Time1=setTimeout("mainplot()",100);
}
function mainplot()
{
lang=0;
xpos=Math.random()*cswi+cswi/2; ypos=0; fs=9; fsi=8
deg=Math.random()*30-15+((xpos<cswi)? +15:-15);
jag=Math.round(Math.random()*100)/100;
zag=Math.round(Math.random()*100)/100;
cur=Math.round((.5 * (Math.random()*10-5))*100)/100;
ion=(Math.random()>.5)? 1:-1;
//status=" "+ct+" Divs "+format(jag)+" jag "+format(zag)+" zag "+cur+" curve"; ct=0;
if (ns4)
{
for (i=1;i<nbs;i++) {
ang=Math.random()*jag*90-jag*45;
if (Math.random()+.05>zag) lang=Math.random()*zag*90-zag*45;
ang+=lang;
ct++;
if (Math.random()*10>9.5 && fsi>1) {fsi--; leg1();}
xpos+=Math.sin((deg+(ang+i*cur))/57.3)*(fsf*fs/9)*.07;
ypos+=Math.abs(Math.cos((deg+(ang+i*cur))/57.3)*(fsf*fs/9)*.07); //fsb=fsf*1.5;
if (aura) { ol.document.layers["a"+i+"f"+fs].moveTo(xpos-(fsf*1.3*fs/9)*.125,ypos-(fsf*1.3*fs/9)*.85); ct++;}
ol.document.layers["s"+i+"f"+fs].moveTo(xpos-(fsf*fs/9)*.125,ypos-(fsf*fs/9)*.85);
if (ypos>shi || xpos<0 || xpos>swi) i=nbs;
}
//status=" "+ct+" Divs "+format(jag)+" jag "+format(zag)+" zag "+cur+" curve";
ol.resizeTo(swi,shi);
Time1=setTimeout("light()",100);
}
if (ie4 || ns5) {
// Rewriting layers can be faster than repositioning in internet explorer
ret="";
fsf=shi*.2;
for (i=1;i<nbs;i++)
{
ang=Math.random()*jag*90-jag*45;
if (Math.random()+.05>zag) lang=Math.random()*zag*90-zag*45;
ang+=lang;
ct++;
if (Math.random()*10>9.5) {fsfi=fsf*.6; fsf*=.95; leg1();}
xpos+=Math.sin((deg+(ang+i*cur))/57.3)*fsf*.07;
ypos+=Math.abs(Math.cos((deg+(ang+i*cur))/57.3)*fsf*.07); fsb=fsf*1.3;
if (ypos>shi || xpos<0 || xpos>swi) i=nbs;
if (aura) { ret+="<DIV id='darg"+i+"' style='position:absolute; left:"+(xpos-fsb*.125)+"; top:"+(ypos-fsb*.85)+"; font-size:"+fsb+"px; color:rgb(0,0,255); z-Index:0' >.</DIV>"; ct++;}
ret+="<DIV style='position:absolute; left:"+(xpos-fsf*.125)+"; top:"+(ypos-fsf*.85)+"; font-size:"+fsf+"px; color:"+bcolor+"; z-Index:1' >.</DIV>";
}
//status=" "+ct+" Divs "+format(jag)+" jag "+format(zag)+" zag "+cur+" curve";
ark.innerHTML=ret;
Time1=setTimeout("lightie()",100);
}
}
function leg1() {
xpo=xpos; ypo=ypos;
lang=zag*ion*(30+Math.random()*20-10);
ion*=-1; lang1=0;
deg1=deg+ion*50+Math.random()*20-10;
jlen=Math.random()*nbs*.25+nbs*.25;
if(ns4) {
fsii=fsi-1
for (j=1;j<jlen;j++) {
ang1=Math.random()*jag*90-jag*45;
if (Math.random()+.05>zag) lang1=Math.random()*zag*90-zag*45;
ang1-=lang1;
ct++;
if (Math.random()*10>9.9 && fsii>1) {fsii--; leg2();}
xpo+=Math.sin((deg1+(ang1+j*cur))/57.3)*(fsf*fsi/9)*.07;
ypo+=Math.abs(Math.cos((deg1+(ang1+j*cur))/57.3)*(fsf*fsi/9)*.07);
if (aura) { ol.document.layers["a"+j+"f"+fsi].moveTo(xpo-(fsf*1.3*fsi/9)*.125,ypo-(fsf*1.3*fsi/9)*.85); ct++;}
ol.document.layers["s"+j+"f"+fsi].moveTo(xpo-(fsf*fsi/9)*.125,ypo-(fsf*fsi/9)*.85);
if (ypo>shi || xpo<0 || xpo>swi) j=jlen;
}
}
if (ie4 || ns5) {
ret+="<DIV id='fork'>";
for (j=1;j<jlen;j++)
{
ang1=Math.random()*jag*90-jag*45;
if (Math.random()+.05>zag) lang1=Math.random()*zag*90-zag*45;
ang1-=lang1;
ct++;
if (Math.random()*10>9.9) {fsfii=fsfi*.6; fsfi*=.95; leg2();}
xpo+=Math.sin((deg1+(ang1+j*cur))/57.3)*fsfi*.07;
ypo+=Math.cos((deg1+(ang1+j*cur))/57.3)*fsfi*.07; fsbi=fsfi*1.3;
if (ypo>shi || xpo<0 || xpo>swi) j=jlen;
if (aura) { ret+="<DIV id='arg"+j+"' style='position:absolute; left:"+(xpo-fsbi*.125)+"; top:"+(ypo-fsbi*.85)+"; font-size:"+fsbi+"px; color:rgb(0,0,255); z-Index:0' >.</DIV>"; ct++;}
ret+="<DIV style='position:absolute; left:"+(xpo-fsfi*.125)+"; top:"+(ypo-fsfi*.85)+"; font-size:"+fsfi+"px; color:"+bcolor+"; z-Index:1' >.</DIV>";
}ret+="</DIV>";
}
}
function leg2() {
xp=xpo; yp=ypo;
lang1=zag*ion*(30+Math.random()*20-10);
//ion*=-1;
lang2=0;
deg2=deg1+ion*50+Math.random()*20-10;
klen=Math.random()*nbs/2+nbs/2; // //
if (ns4) {
for (k=nbs/2;k<klen;k++) {
ang2=Math.random()*jag*90-jag*45;
if (Math.random()+.05>zag) lang2=Math.random()*zag*90-zag*45;
ang2-=lang2;
ct++;
xp+=Math.sin((deg2+(ang2+k*cur))/57.3)*(fsf*fsii/9)*.07;
yp+=Math.cos((deg2+ang2)/57.3)*(fsf*fsii/9)*.07;
if (aura) { ol.document.layers["a"+k+"f"+fsii].moveTo(xp-(fsf*1.3*fsii/9)*.125,yp-(fsf*1.3*fsii/9)*.85); ct++;}
ol.document.layers["s"+k+"f"+fsii].moveTo(xp-(fsf*fsii/9)*.125,yp-(fsf*fsii/9)*.85);
if (yp>shi || xp<0 || xp>swi) k=klen;
}
}
if (ie4 || ns5) {
ret+="<DIV id='forki'>";
for (k=nbs/2;k<klen;k++)
{
ang2=Math.random()*jag*90-jag*45;
if (Math.random()+.05>zag) lang2=Math.random()*zag*90-zag*45;
ang2-=lang2;
ct++;
xp+=Math.sin((deg2+(ang2+k*cur))/57.3)*fsfii*.07;
yp+=Math.cos((deg2+(ang2+k*cur))/57.3)*fsfii*.07; fsbii=fsfii*1.3;
if (yp>shi || xp<0 || xp>swi) k=klen;
if (aura) { ret+="<DIV id='arg"+k+"' style='position:absolute; left:"+(xp-fsbii*.125)+"; top:"+(yp-fsbii*.85)+"; font-size:"+fsbii+"px; color:rgb(0,0,255); z-Index:0' >.</DIV>"; ct++;}
ret+="<DIV style='position:absolute; left:"+(xp-fsfii*.125)+"; top:"+(yp-fsfii*.85)+"; font-size:"+fsfii+"px; color:"+bcolor+"; z-Index:1' >.</DIV>";
}
ret+="</DIV>";
}
}
function light()
{ ol.moveTo(pageXOffset,pageYOffset);
ol.visibility = "show";
if (flash) document.bgColor=skyFlash;
Time2=setTimeout("ning()",(Math.random()*1000+1000));
}
function lightie()
{ ark.style.left=document.body.scrollLeft;
ark.style.top=document.body.scrollTop;
ark.style.visibility = "visible";
if (flash) document.bgColor=skyFlash;
Time2=setTimeout("ningie()",(Math.random()*500+100));
}
function ning()
{
if (flash) document.bgColor=skyNorm;
ol.visibility = "hide";
if (Math.random()*3>2) Time2=setTimeout("light()",(Math.random()*500+100));
else {
for (fs=1;fs<10;fs++)
for (i=1;i<nbs;i++) {
if (aura) ol.document.layers["a"+i+"f"+fs].moveTo(-100,-100);
ol.document.layers["s"+i+"f"+fs].moveTo(-100,-100);
}
Time1=setTimeout("mainplot()",(Math.random()*500+100))
}
}
function ningie()
{ ark.style.visibility = "hidden";
if (flash) document.bgColor=skyNorm;
if (Math.random()*3>2) Time2=setTimeout("lightie()",(Math.random()*500+100)); else Time1=setTimeout("mainplot()",(Math.random()*500+100));
}
function format(f){ f+="";
if (f.charAt(0)==".") f="0"+f;
if (f.length==1) f+=".00";
if (f.length==3) f+="0";
return f;
}
function halt() {
if (Time1) {clearTimeout(Time1); Time1=null;}
if (Time2) {clearTimeout(Time2); Time2=null;}
}
//-->
</SCRIPT>
<SCRIPT language=Javascript>
<!--
swi=(ie4)? document.body.offsetWidth-17:window.innerWidth;
shi=(ie4)? document.body.offsetHeight-4:window.innerHeight;
cswi=swi/2;
cshi=shi/2;
ret="<DIV id='ark' style='position:absolute; left:0; top:0; width:"+swi+"; height:"+shi+"; visibility:visible; z-index=1; overflow:hidden; clip:rect(0,"+(swi)+","+(shi)+",0)'></DIV>";
document.write(ret);
//-->
</SCRIPT>
第二步:把<body>中的内容改为:
<BODY bgcolor="#fef4d9"
οnlοad=window.focus();init();
οnresize=document.location.href=document.location.href; οnunlοad=halt();>
<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>
————————————————————————————
漫天飞雪
脚本说明:
第一步:把如下代码加入<body>区域中
<script language="JavaScript">
<!--
N = 40;
Y = new Array();
X = new Array();
S = new Array();
A = new Array();
B = new Array();
M = new Array();
V = (document.layers)?1:0;
iH=(document.layers)?window.innerHeight:window.document.body.clientHeight;
iW=(document.layers)?window.innerWidth:window.document.body.clientWidth;
for (i=0; i < N; i++){
Y[i]=Math.round(Math.random()*iH);
X[i]=Math.round(Math.random()*iW);
S[i]=Math.round(Math.random()*5+2);
A[i]=0;
B[i]=Math.random()*0.1+0.1;
M[i]=Math.round(Math.random()*1+1);
}
if (V){
for (i = 0; i < N; i++)
{document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0 BGCOLOR='#FFFFF0' CLIP='0,0,"+M[i]+","+M[i]+"'></LAYER>")}
}
else{
document.write('<div style="position:absolute;top:0px;left:0px">');
document.write('<div style="position:relative">');
for (i = 0; i < N; i++)
{document.write('<div id="si" style="position:absolute;top:0;left:0;width:'+M[i]+';height:'+M[i]+';background:#fffff0;font-size:'+M[i]+'"></div>')}
document.write('</div></div>');
}
function snow(){
var H=(document.layers)?window.innerHeight:window.document.body.clientHeight;
var W=(document.layers)?window.innerWidth:window.document.body.clientWidth;
var T=(document.layers)?window.pageYOffset:document.body.scrollTop;
var L=(document.layers)?window.pageXOffset:document.body.scrollLeft;
for (i=0; i < N; i++){
sy=S[i]*Math.sin(90*Math.PI/180);
sx=S[i]*Math.cos(A[i]);
Y[i]+=sy;
X[i]+=sx;
if (Y[i] > H){
Y[i]=-10;
X[i]=Math.round(Math.random()*W);
M[i]=Math.round(Math.random()*1+1);
S[i]=Math.round(Math.random()*5+2);
}
if (V){document.layers['sn'+i].left=X[i];document.layers['sn'+i].top=Y[i]+T}
else{si[i].style.pixelLeft=X[i];si[i].style.pixelTop=Y[i]+T}
A[i]+=B[i];
}
setTimeout('snow()',10);
}
//-->
</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">
<!--
function backcolor(form){
temp = ""
for (var i = 0; i < 16; i++) {
temp = form.color[i].value
if (form.color[i].checked){ document.bgColor = temp }
}
}
function randombackground(){
document.bgColor = getColor()
}
function getColor(){
currentdate = new Date()
backgroundcolor = currentdate.getSeconds()
if (backgroundcolor > 44)
backgroundcolor = backgroundcolor - 45
else if (backgroundcolor > 29)
backgroundcolor = backgroundcolor - 30
else if (backgroundcolor > 15)
backgroundcolor = backgroundcolor - 16
if (backgroundcolor == 0 )
return "olive";
else if (backgroundcolor == 1 )
return "teal";
else if (backgroundcolor == 2 )
return "red";
else if (backgroundcolor == 3 )
return "blue";
else if (backgroundcolor == 4 )
return "maroon";
else if (backgroundcolor == 5 )
return "navy";
else if (backgroundcolor == 6 )
return "lime";
else if (backgroundcolor == 7 )
return "fuschia";
else if (backgroundcolor == 8 )
return "green";
else if (backgroundcolor == 9 )
return "purple";
else if (backgroundcolor == 10 )
return "gray";
else if (backgroundcolor == 11 )
return "yellow";
else if (backgroundcolor == 12 )
return "aqua";
else if (backgroundcolor == 13 )
return "black";
else if (backgroundcolor == 14 )
return "white";
else if (backgroundcolor == 15 )
return "silver";
}
// -->
</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>
<!-- http://www.alixixi.com/ -->
<!-- http://bbs.alixixi.com/ -->
<!--要完成此效果把如下代码加入到<body>区域中-->
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var clocktext;
var pagetitle = document.title;
function scroll() {
today = new Date();
sec = today.getSeconds();
hr = today.getHours();
min = today.getMinutes();
if (hr <= 9) hr = "0" + hr;
if (min <= 9) min = "0" + min;
if (sec <= 9) sec = "0" + sec;
var clocktext = " 现在时间是: " + hr + ":" + min + ":" + sec;
clocktimer = setTimeout("scroll()", 1000);
document.title = pagetitle + clocktext;
}
if (document.all) scroll();
// End -->
</script>
<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>
————————————————————————————
小心 小心
有什么问题请到<a href='/bbs/index.asp?boardid=2'>论坛</a>中发表<br>
<!--# 特效来源:http://www.alixixi.com/js -->
<!--把如下代码加入<body>区域中:-->
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin -->
</SCRIPT>
<center>
下面的每一个按钮都很危险,一按你的电脑立即<font color=red>OVER</font>,不信试试吧!!!<br>
<FORM method=post name="FormAction" action="mailto:"+"webmaster@javascript2000.com">
<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>
<!-- http://www.alixixi.com/ -->
<!-- http://bbs.alixixi.com/ -->
<!--# 特效来源:http://www.alixixi.com/js -->
<!--要完成此效果把如下代码加入到<body>区域中-->
<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>
<!-- http://www.alixixi.com/js -->
<!-- bbs http://www.alixixi.com/bbs-->
<!-- 完整的HTML代码 -->
把下列代码粘贴到 <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.οnlοad=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>
<!-- http://www.alixixi.com -->
<!-- bbs http://bbs.alixixi.com -->
<!--完整的HTML文件如下:-->
<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区域内-->
<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>
<!--把下列代码加到BODY区域内-->
<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].οnclick=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.οnclick=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.οnlοad=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">
<!--
body { font-family: "宋体"; font-size: 9pt; margin-top: 0px; margin-left: 0px; margin-right: 0px}
A { COLOR: black; FONT-SIZE: 11pt; FONT-WEIGHT: 400; TEXT-DECORATION: none }
A:hover { COLOR: red; FONT-SIZE: 11pt; FONT-WEIGHT: 400; TEXT-DECORATION: underline }
a:active { font: 11pt "宋体"; cursor: hand; color: #FF0033 }
-->
</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.οnresize=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.οnscrοll=logoit
window.οnresize=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.οnlοad=setmessage2
else if (document.all)
window.οnlοad=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">
<!-- hide
function goHist(a)
{
history.go(a);
}
//-->
</script></center>
</body>
</html>
<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>
——————————————————————————