透明渐变弹出菜单的制作

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

非常漂亮的一个菜单脚本,代码也不复杂,用透明渐变来实现,渐变的速度可调。

制作方法:

在页面<head>~</head>中加入代码:

<SCRIPT language=javascript>

var intDelay=30; //设置菜单显示速度,越大越慢

var intInterval=5;

function MenuClick()

{

if (LayerMenu.style.display=="")

{

GradientClose();

}

else{

LayerMenu.filters.alpha.opacity=0;

LayerMenu.style.display="";

GradientShow();

}

}

function GradientShow()

{

LayerMenu.filters.alpha.opacity+=intInterval;

if (LayerMenu.filters.alpha.opacity<100) setTimeout("GradientShow()",intDelay);

}

function GradientClose()

{

LayerMenu.filters.alpha.opacity-=intInterval;

if (LayerMenu.filters.alpha.opacity>0) {

setTimeout("GradientClose()",intDelay);

}

else {

LayerMenu.style.display="none";

}

}

</SCRIPT>

代码中,var intDelay=30;为菜单渐隐速度,数值越大越慢。

插入图层,并设置Diy属性代码:

<DIV id=LayerMenu style="DISPLAY: none; Z-INDEX: 1; FILTER: alpha(opacity=0); POSITION: absolute; ">

在超链接处,添加代码:

<A href="#" onclick=MenuClick()>点击</A>

透明渐变弹出菜单的特效就制作完成了!

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有 導航