当前位置:七道奇文章资讯设计学堂DW设计
日期:2009-10-01 01:59:00  来源:本站整理

<b>dreamweaver中网页折叠菜单的制作</b>[DW设计]

赞助商链接



  本文“<b>dreamweaver中网页折叠菜单的制作</b>[DW设计]”是由七道奇为您精心收集,来源于网络转载,文章版权归文章作者所有,本站不对其观点以及内容做任何评价,请读者自行判断,以下是其具体内容:

 去过Microsoft的吗?(如图一)假如去过的话,那么你应当对这个站上面那条折叠式菜单的导航栏感到惊叹吧?(“嘿嘿,还是老盖强.”“啊,鸡蛋怎么会飞呀?!”)你想过你也可以做出这样的效果吗?来吧,不用羡慕了,心动不如行动!



  折叠式菜单实际上是通过层的显示和躲藏,来到达这种效果的.目前就让我来说说若何制作吧.Follow Me!先翻开(对层的支持很好的,也是做的必备工具).

  第一步:先插入一个一行、两列的表格,办法:单击菜单上的“插入”(Insert),再选取“表格”(Table),在“行”(Row)中输入1,在列(Columns)中输入2,在单击“肯定”.(如图二)为了美好,在表格的属性栏中,把宽和高辨别设为200px和30px,并且把表格的边框颜色全部设为#FFFFFF,然后辨别点选两个单元格,在属性栏中将其边框颜色设为#6699FF.在两个单元格内辨别输入“资料”和“相关软件”.并在单元格属性栏中设为中间对齐(趁便说一句:在中不但可以设定表格水平对齐方法,并且可以设定垂直位置对齐方法,在FrontPage就只能自己去写代码了,这也是我放弃FrontPage利用的缘由之一!)



  第二步,在“资料”单元格内插入一个层.办法:单击菜单上的“插入”(Insert),再选取“层”(Layer).这时,在单元格中便会呈现一个层.这时我们并不称心层的位置,所以就来移动它.层的移动是非常简单的,选取层,然后按键盘上的箭头键便可以移动了,并且不受任何限制,呵呵,简单吧.一样,我们为了美好也可以在层的属性栏中设定它的大小,把宽和高辨别设为100px和90px.

  第三步:在层中插入一个三行、一列的表格,办法同第一步.并把宽和高辨别设为100px和90px,以填满这个层.再把边框颜色做如第一步的设置.在三个单元格中输入“”、“FrontPage”和“HotDog”.并在属性栏中设为中间对齐.
 

  第四步:最关键的一步来了!在层的属性栏中将“可视”设为“躲藏”(Hidden),这样在翻开时便看不见这个层(如果看得见那还叫什么折叠式呀?!).接着选取单元格,然后单击最下面那一条状况栏右边的“显示行为”按钮(就是那个最中间的,由两个圆圈构成的那个),来给单元格增添行为.这里要注意一个:一定要看好了!在行为栏的标题栏上一定如果显示“<td>”才行,这阐明你要增添的这个行为是增添在单元格上的,假如没有的话那就要重新点选单元格,直到成功为止.(如图三)



  在“行为目标”(Events For)中挑选一个符合的浏览器,普通是挑选“IE 4.0”.然后单击左边的“+”按钮,来增添行为.在弹出的菜单中挑选“显示或躲藏层”(Show-Hid Layers), 在弹出的窗口中挑选“Layer “Layer1””,就是我们方才增添的那个层了,再单击“显示”(Show),肯定就行了.这时在行为栏中就呈现了我们方才增添的这个行为了.接着单击“事件”(Events)下面右边的那个向下箭头按钮,在弹出菜单中挑选“当鼠标移上”(OnMouseOver).好了,这样当页面载入时,这个层并不会呈现,只有当我们的鼠标移上单元格时才会呈现,怎样?酷吧?Stop!不要高兴得太早了,不要忘了还有一个问题:鼠标移开单元格之后这个层还是显示着的呀!并不会自动消逝的.(不要把当作全自动的,你不奉告它怎么做时,它只是一堆废铁.^_^)其实办理这个问题也很简单,我们可以增添显示层的行为,当然也可以增添躲藏层的行为呀!再单击“+”按钮,选取“显示或躲藏层”,还是选取“Layer1”,不过这次我们点击的是“躲藏”(Hide)了,再肯定.然后挑选“事件”,单击“当鼠标移开”(OnMouseOut).OK!完成了.

  接下来,按照从第二步到第四步的历程,对“相关软件”单元格举行操作.一切完成之后,按下“F12”,预览一下,呵呵,怎么样?简单的几步,就完成了这样炫的效果,一切还是的功绩啊!(效果如图四)



  还有一个需求注意,层的移动有时并不能做到“所见即所得”的效果,在编辑时本来位置很称心,但是预览时却一塌胡涂,这就要多预览几次,多改正,才能得到好的效果.


  以上是“<b>dreamweaver中网页折叠菜单的制作</b>[DW设计]”的内容,如果你对以上该文章内容感兴趣,你可以看看七道奇为您推荐以下文章:
  • <b>hosts是什么 hosts文件在什么位置 若何改正hosts</b>
  • <b>在 Windows 8 中手动安装语言包</b>
  • <b>五个常见 PHP数据库问题</b>
  • Windows中Alt键的12个高效快速的利用本领介绍
  • <b>MySQL ORDER BY 的实现解析</b>
  • <b>详解MySQL存储历程参数有三种范例(in、out、inout)</b>
  • <b>Win8系统恢复出来经典的开始菜单的办法</b>
  • <b>Win8系统花屏怎么办 Win8系统花屏的办理办法</b>
  • <b>Windows 7系统下无线网卡安装</b>
  • <b>为什么 Linux不需求碎片整理</b>
  • <b>Windows 8中删除账户的几种办法(图)</b>
  • <b>教你如安在win7下配置路由器</b>
  • 本文地址: 与您的QQ/BBS好友分享!
    • 好的评价 如果您觉得此文章好,就请您
        0%(0)
    • 差的评价 如果您觉得此文章差,就请您
        0%(0)

    文章评论评论内容只代表网友观点,与本站立场无关!

       评论摘要(共 0 条,得分 0 分,平均 0 分) 查看完整评论
    Copyright © 2020-2022 www.xiamiku.com. All Rights Reserved .