用Dreamweaver制作下拉菜单(下)

Author: 袁一春 Date: 2001年 20期

#1?牐牰嗉恫说?
  ?牐犝馐歉龆嗉恫说ィ颐蔷驮谏匣乩覯acromedia→Flash菜单下再加三个子菜单:Flash素材、Flash站点和Flash论坛。
  ?牐?1.插入相关的层和表格。先插入一个一行五列的表格,在每个单元格中插入相应的图片,并在Macromedia图片后换行插入层“Layer1”,并设置层“Layer1”的高宽等属性。再在层“Layer”中插入一个四行一列的表格,将相应的图片插入单元格中。接着,在紧挨着Flash图片不换行的地方用Insert→Layer菜单插入层“Layer2”并设置属性。最后,在层“Layer2”中插入一个三行一列的表格,将刚刚制作好的三张图片分别插入单元格(^20040703a^1)。
  ?牐犓淙辉贒reamweaver中,层“Layer2”似乎和Flash图片之间有换行(这是因为表格宽度不够了),但是实际上是不换行的。
  ?牐?2.加入链接和Behavior,给每个图片加入必要的超链接,如果没有,可以链接到“#####”或者“javascript:void(0)”。Macromedia图片和层“Layer1”的Behavior不变,和上例保持一致。最后再给Flash图片和层“Layer2”加入Behavior。其中,Flash图片的Behavior为:当鼠标移动到Flash图片上时,显示层“Layer2”;当鼠标移出Flash图片时,隐藏层“Layer2”。“Layer2”层的Behavior和Flash图片一样。
  ?牐?3.最后的整理。这一部分是这个例子的关键。先隐藏每个层,接着按工具栏的按钮,使代码编辑环境在工具栏下部出现。在代码编辑环境中查找<div id="Layer2",直到最近出现的一个</div>都是用来控制层“Layer2”的。这一段代码之最后出现的代码是</a>。我们需要做的是将<div id="Layer2"和它前面的</a>连在一起写,删去中间的换行和空格!这一点非常重要(^20040703b^2)。
  ?牐犠詈蟊4胬投晒4蚩榔鳎涂梢钥吹叫Ч耍╚20040703c^3)。
  #1?牐牷说?
  ?牐牷说ブ荒苡迷谕匙钭蟊呋蛘咄车纳媳撸艺鲆趁姹匦刖幼螅裨蛟诓煌直媛氏落谰突岢鱿执砦弧2还だ龅男Ч故侵档么蠹胰パ?习这个例子的!
  ?牐?1.插入层和表格并布局。打开Dreamweaver,执行Modify→Page Properties 命令,在弹出对话框的Left和Top都设置为“0”,意思是页面中的内容和和浏览器边框的的上、左距离都为“0”。点击Object面板的按钮,然后在页面中拖出一个层来,名字为“Layer1”。并且用鼠标拖住层的句柄,将层移动到页面顶部。和顶部距离为“0”。当然,你也可以通过属性面板来完成这个工作。然后在层“Layer1”中插入一个一行五列的表格,每个单元格分别插入相应的图片(^20040703d^4)。
  ?牐犜儆冒磁ネ铣鲆桓霾憷矗癓ayer2”。在其中插入四行一列的表格,子菜单的图片分别插入其中,并调整层的高和宽刚好包住子菜单的图片为好。
  ?牐?2.Timeline和Behavior。这部分是这个例子的关键。用Window→Timeline菜单打开Timeline面板,将层“Layer2”拖入Timeline面板内。这样会自动生成一个名为Layer2的时间轴。你可以拖动第二个关键帧的位置来确定这个时间轴的长度,这里,我们用默认值15帧。在最后一个关键帧上点鼠标右键,在弹出菜单中选择Add Behavior,然后在Behaviors面板中点“+”,接着选择 Timeline→Stop Timeline。在弹出对话框中选择Timeline1,最后点“OK”确定(^20040703e^5)。
  ?牐犜赥imeline面板中将最后一个关键帧选中,将层“Layer2”拖到和Macromedia图片正下方,并且紧密接触,不留一点空隙(^20040703f^6)。
  ?牐犜傺≈械谝桓龉丶。恪癓ayer2”竖直向上拖动,直到层的下边框和Macromedia图片下边框重合为止(^20040703g^7)。
  ?牐牭比唬陨贤隙ぷ鞫伎梢酝ü粜悦姘謇唇形⒌鳌H绻愕姆轿桓泻芎茫苯永檬粜悦姘謇床僮魇亲詈玫摹?
  ?牐牻恪癓ayer2”选中,添加Behavior:Timeline→Go to Timeline Frame。在新对话框的Frame中添入15,激发事件为onMouseOver;再添加Behavior:Timeline→Go to Timeline Frame。在新对话框的Frame中添入1。最后点击OK确定,激发事件为onMouseOut。选中“Layer1”,在属性面板上将层“Layer1”的Z-index值设置得大一些(100以上)。然后选中Macromedia图片,添加Behavior:Timeline→Play Timeline (Timeline1),激发事件为onMouseOver;再添加一个Timeline→Go to Timeline Frame 。在新对话框的Frame中添入1。最后点击OK确定,激发事件为onMouseOut。
  ?牐牶昧耍蠊Ω娉桑4妫阡榔髦新砩峡梢钥吹窖だ龅男Ч恕?