下拉菜单全攻略之Fireworks篇
http://tech.ddvip.com 2007年04月16日 社区交流
本文详细介绍下拉菜单全攻略之Fireworks篇
存盘,回到菜单的HTML文件,F12预览,菜单样式已经发生了变化,菜单边框变细致了,是不是很cool啊!

3. 弹出菜单缩回停留时间的修改
大家会发现弹出菜单要收回似乎要等待一两秒的时间,没关系,在fw_menu.js中找到这句代码:
fwHideMenuTimer = setTimeout("fwDoHide()", 1000);
将其中的1000改成300,再找到这句代码:
if (elapsed < 1000) {
fwHideMenuTimer = setTimeout("fwDoHide()", 1100-elapsed);
return;
}将其中的1000改成300,1100改成330,存盘,再回到HTML文件按F12预览一下,是不是快多了。这些数值是以毫秒为单位的,也就是说1000代表1秒,建议这些数值不要设得太小,否则菜单收回太快会导致你点不中弹出菜单。
4. 特殊效果的弹出菜单
运用Javascript来调用和控制CSS滤镜还可以为菜单带来意想不到的效果。在fw_menu.js中使用这样的参数设置:
this.bgColor = "";
this.menuBorder = 3;
this.menuItemBorder = 3;
this.menuItemBgColor = bg||"#cccccc";
this.menuLiteBgColor = "";
this.menuBorderBgColor = "";
this.menuHiliteBgColor = bgh||"#000084";
this.menuContainerBgColor = "#cccccc";
this.childMenuIcon = "arrows.gif";并在下面加上一句:
this.alpha = "Alpha(Opacity=100, FinishOpacity=0, Style=2, StartX=0, StartY=0, FinishX=200, FinishY=0)";
然后找到这句:
l.style.backgroundColor = menu.menuItemBgColor;
在它下面加上一句:
l.style.filter = menu.alpha;
存盘,回到HTML文件按F12预览,效果如下图所示,是不是很有趣啊!这样的CSS滤镜还有很多,大家可以自己找一些相关资料实践一下。
顺便提一下,大家在查找代码时可以充分利用DW4的查找替换功能,在页面中按Ctrl+F快捷键调出查找替换窗,输入要查找的代码,按Find Next就可以了。

下一篇我们将讲如何用Flash来制作下拉菜单。
作者:Poorfish 责编:豆豆技术应用