您现在的位置: 像素吧 >> 设计教程 >> DreamWeaver教程 >> 正文
滑动菜单的制作(组图)
"滑动菜单的制作(组图)"这篇DreamWeaver教程如果帮助了您,请记得分享给您身边的朋友,如果您有比"滑动菜单的制作(组图)"更好的教程请发布共享,帮助别人快乐自己!
今天应朋友们要求,来对我网站上一个滑动菜单效果写一篇简单的教程;在牛筋大学软件部有一个关于层滑动的效果,好像Itnow上的广告也是采用的这样效果,不用的时候隐藏,用的时候点击一下按钮层就慢慢的滑动出来,即节省了有限的页面空间,还达到了令人羡慕的视觉效果,感觉起来还不错。这个效果大家可以点击这里察看.
1. 在dw中新建一个空白文档(或者打开你要添加效果的页面)。
2. 设置好你自己的css风格。
3.在页面上插入一个长500pix的表格(这里说明:插入表格的目的是为了控制层在不同分辨率下保持相对的位置不变,如果你的页面之前没有做相关设置,那么这一部你可能要费点功夫整理一下你的页面结构)。
4. 将光标置入表格内,点击菜单 [插入——层] 插入一个长500高20的图层,并命名为layer1。
5. 然后再将光标置入图层layer1,点击菜单[插入——层]再插入一个长500高130的图层layer2;并将layer2的属性中左边距和上边距都设置为0,并为它指定一个你喜欢的背景色。
6.然后重复步骤5的方法,再插入一个图层layer3,这个图层没什么特殊的用处,在我的这个教程中,我只不过是为了放置几个按钮而已。最后我的开起来如图:
现在开始,才正式进入到我们今天要制作的滑动菜单的制作过程中。1
