分享
 
 
 

超酷的一种菜单特效代码,网页特效

王朝html/css/js·作者佚名  2006-11-24
窄屏简体版  字體: |||超大  

<html>

<head>

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

<title>酷酷菜单代码</title>

<SCRIPT LANGUAGE="JavaScript">

<!--

var distance=0;distance1=0;

function move1()

{

if(distance!=50)

{span1.style.pixelLeft+=1;span3.style.pixelLeft+=1;span5.style.pixelLeft+=1;span2.style.pixelLeft-=1;span4.style.pixelLeft-=1;span6.style.pixelLeft-=1;span1.filters.alpha.opacity+=2;span2.filters.alpha.opacity+=2;span3.filters.alpha.opacity+=2;span4.filters.alpha.opacity+=2;span5.filters.alpha.opacity+=2;span6.filters.alpha.opacity+=2;

midspan1.filters.alpha.opacity+=2;midspan2.filters.alpha.opacity+=2;midspan1.style.pixelTop+=1;midspan2.style.pixelTop-=1;

leftspan.filters.alpha.opacity+=2;rightspan.filters.alpha.opacity+=2;

censpan.filters.alpha.opacity-=1;

distance++;setTimeout('move1()',1);

}else{move2();};

abovespan1.style.display='none';abovespan2.style.display='none';

}

function move2()

{

censpan.style.display='none';

if(distance1!=44)

{colspan1.style.pixelLeft+=1;colspan2.style.pixelLeft-=1;colspan3.style.pixelLeft+=1;colspan4.style.pixelLeft-=1;

rowspan1.style.pixelTop+=1;rowspan2.style.pixelTop+=1;rowspan3.style.pixelTop-=1;rowspan4.style.pixelTop-=1;rowspan5.style.pixelTop+=1;rowspan6.style.pixelTop+=1;rowspan7.style.pixelTop-=1;rowspan8.style.pixelTop-=1;

rowspan1.filters.alpha.opacity+=1;rowspan2.filters.alpha.opacity+=1;rowspan3.filters.alpha.opacity+=1;rowspan4.filters.alpha.opacity+=1;rowspan5.filters.alpha.opacity+=1;rowspan6.filters.alpha.opacity+=1;rowspan7.filters.alpha.opacity+=1;rowspan8.filters.alpha.opacity+=1;

colspan1.filters.alpha.opacity+=2;colspan2.filters.alpha.opacity+=2;colspan3.filters.alpha.opacity+=2;colspan4.filters.alpha.opacity+=2;

upspan1.style.pixelTop-=1;upspan2.style.pixelTop+=1;upspan1.filters.alpha.opacity+=2;upspan2.filters.alpha.opacity+=2;

spanA.style.pixelLeft-=1;spanB.style.pixelLeft+=1;spanA.filters.alpha.opacity+=2;spanB.filters.alpha.opacity+=2;

distance1++;

spanC.style.pixelLeft-=2;spanD.style.pixelLeft+=2;spanC.filters.alpha.opacity+=1;spanD.filters.alpha.opacity+=1;

setTimeout('move2()',1);}

}

//-->

</SCRIPT>

</head>

<body>

<span id=span1 style=filter:alpha(opacity=0);position:absolute;left:200;top:100;z-index:1;width:50;height:15;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;cursor:hand; onmouseover=this.style.background='306898';add1.style.display='block';midspan2.innerText="菜单一的主题";midspan1.innerText="ONE" onmouseout=this.style.background='orange';add1.style.display='none';midspan2.innerText="";>菜单一</span><br>

<span id=span2 style=filter:alpha(opacity=0);position:absolute;left:300;top:115;z-index:1;width:50;height:15;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;cursor:hand; onmouseover=this.style.background='306898';add2.style.display='block';midspan2.innerText="菜单二的主题";midspan1.innerText="TWO" onmouseout=this.style.background='orange';add2.style.display='none';midspan2.innerText="";>菜单二</span><br>

<span id=span3 style=filter:alpha(opacity=0);position:absolute;left:200;top:130;z-index:1;width:50;height:15;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;cursor:hand; onmouseover=this.style.background='306898';add3.style.display='block';midspan2.innerText="菜单三的主题";midspan1.innerText="THREE" onmouseout=this.style.background='orange';add3.style.display='none';midspan2.innerText="";>菜单三</span><br>

<span id=span4 style=filter:alpha(opacity=0);position:absolute;left:300;top:145;z-index:1;width:50;height:15;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;cursor:hand; onmouseover=this.style.background='306898';add4.style.display='block';midspan2.innerText="菜单四的主题";midspan1.innerText="FOUR" onmouseout=this.style.background='orange';add4.style.display='none';midspan2.innerText="";>菜单四</span><br>

<span id=span5 style=filter:alpha(opacity=0);position:absolute;left:200;top:160;z-index:1;width:50;height:15;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;cursor:hand; onmouseover=this.style.background='306898';add5.style.display='block';midspan2.innerText="菜单五的主题";midspan1.innerText="FIVE" onmouseout=this.style.background='orange';add5.style.display='none';midspan2.innerText="";>菜单五</span><br>

<span id=span6 style=filter:alpha(opacity=0);position:absolute;left:300;top:175;z-index:1;width:50;height:15;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;cursor:hand; onmouseover=this.style.background='306898';add6.style.display='block';midspan2.innerText="菜单六的主题";midspan1.innerText="SIX" onmouseout=this.style.background='orange';add6.style.display='none';midspan2.innerText="";>菜单六</span><br>

<span id=leftspan style=filter:alpha(opacity=0);position:absolute;left:191;top:100;width:60;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=rightspan style=filter:alpha(opacity=0);position:absolute;left:299;top:100;width:60;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=abovespan1 style=z-index:6;filter:alpha(opacity=0);position:absolute;left:191;top:100;width:60;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=abovespan2 style=z-index:6;filter:alpha(opacity=0);position:absolute;left:299;top:100;width:60;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=spanA style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:221;top:110;width:20;height:71;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=spanB style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:309;top:110;width:20;height:71;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=spanC style=z-index:-2;filter:alpha(opacity=0);position:absolute;left:251;top:120;width:20;height:51;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=spanD style=z-index:-2;filter:alpha(opacity=0);position:absolute;left:279;top:120;width:20;height:51;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=rowspan1 style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:231;top:100;width:10;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=rowspan2 style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:211;top:100;width:10;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=rowspan3 style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:231;top:100;width:10;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=rowspan4 style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:211;top:100;width:10;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=rowspan5 style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:310;top:100;width:10;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=rowspan6 style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:331;top:100;width:10;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=rowspan7 style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:310;top:100;width:10;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=rowspan8 style=z-index:-1;filter:alpha(opacity=0);position:absolute;left:331;top:100;width:10;height:91;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=midspan1 style=filter:alpha(opacity=0);position:absolute;left:252;top:142;width:46;height:30;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=midspan2 style=filter:alpha(opacity=0);position:absolute;left:252;top:119;width:46;height:30;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=colspan1 style=z-index=-1;filter:alpha(opacity=0);position:absolute;left:252;top:199;width:60;height:10;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=colspan2 style=z-index=-1;filter:alpha(opacity=0);position:absolute;left:238;top:199;width:60;height:10;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=colspan3 style=z-index=-1;filter:alpha(opacity=0);position:absolute;left:252;top:77;width:60;height:10;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=colspan4 style=z-index=-1;filter:alpha(opacity=0);position:absolute;left:238;top:77;width:60;height:10;background:orange;border-style:solid;border-width:1;text-align:center;font-size:9pt;></span>

<span id=add1 style=filter:alpha(opacity=30);position:absolute;left:299;top:100;width:60;height:91

[1] [2] 下一页

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有