Dreamweaver“行为”入门

Author: 梦觉 Date: 2001年 28期

?牐牶芏嗯笥蜒?习Dreamweaver软件一段时间以后,开始对普通的静态页面不再感到满意,网上各种纷繁多样的动态交互式网页效果非常吸引人,可是作为刚刚入门的网页制作者,对网页编程还不是很熟悉,而这些交互效果很多都需要具有JavaScript知识。幸好在Dreamweaver软件中有强大的行为面板(Behaviors)。使用Dreamweaver行为,普通的网页设计者可以轻易做出诸如弹出窗口、显示和隐藏层、改变状态条文字、播放多媒体文件甚至制作出动态飘动的图层等等,更复杂的还可以做出常见的下拉菜单效果,以及拖曳层的效果等复杂的动态网页。
  ?牐牻裉煳抑桓蠹医樯蹹reamweaver中行为面板的基本用法和知识,在介绍之前需要简单说明组成行为的两个部分:事件(Event)和动作(Action)。事件是一个动作的触发器,在网页上既可以是用户触发的,如鼠标的滑过、点击等,也可以是自动完成的,如一个页面的载入或关闭。动作则是一系列复杂的变化,可以是在状态条显示一条信息,或是复杂的翻转效果,打开新窗口等等。而所有的行为都是依附在某个特定的元素上的,例如一个文本链接、一个图像或一个层等等。
  ?牐犕ǔT贒reamweaver中创建一个行为需要经过以下几个步骤:
  ?牐?1.选取一个特定的元素。例如一个文字链接或一个图片等等,最常见的是一个链接。行为将被加到此特定的元素上。
  ?牐?2.选择你希望兼容的浏览器版本。因为不同的浏览器支持的事件不相同,如果你希望更多的人能看到你做的效果,你必须选择较低的浏览器选项。通常我们选择IE4.0以上版本的浏览器。
  ?牐?3.选择一个希望执行的动作。例如交换图片,隐藏一个层,或是在状态栏显示一段文字。
  ?牐?4.为上述的动作设定具体的参数。虽然Dreamweaver自带的动作看起来有限,但通过设定不同的参数我们可以做出很复杂的效果。
  ?牐犜诒窘坛讨形颐遣豢赡芟晔鲂形姘宓那看蠊δ埽抑饕蔷倭礁隼痈蠹医樯苌鲜龅恼饧父霾街瑁源酥傅即蠹已Щ崾褂眯形姘濉?
  #1?牐犑道唬旱鎏崾拘畔?
  #2?牐犚弧⒃ざㄐЧ?
  ?牐牭蔽颐墙胍恍┩臼保腔嶙远鲆桓龌队翱诨蛱崾究颍ㄍ糬28040703a^1)。
  #2?牐牰⒅谱鞴?
  ?牐?1.打开你的页面(可以是一个已有的页面也可以是一个新页面),我们的这个行为将加载到页面本身,即页面装入时启动这个动作。打开行为面板,此时虽然没有选择任何元素,其实我们是处在<Body>元素处,可以从行为面板看到当前作用的元素(图^28040703b^2)。
  ?牐?2.选择希望兼容的浏览器,这里我们选择“4.0 and Later Browsers”(图^28040703c^3)。
  ?牐?3.在行为对话框中点击“+”号,添加行为(图^28040703d^4)。
  ?牐?4.选择“Popup Message”,即弹出信息动作(图^28040703e^5)。
  ?牐?5.设定动作的具体参数。弹出信息的动作只有一个内容需要填写,即提示信息。我们添入相应的提示信息(图^28040703f^6)。
  ?牐?6.添加行为结束。当我们选择了一个动作后,Dreamweaver会自动添加一个相应的缺省事件。在本文中Dreamweaver将触发此动作的事件设定为页面载入时,即当浏览者浏览此页面时,自动触发我们上面添加的弹出提示信息这一动作,我们可以打开行为检查器来观察。
  ?牐牬油迹╚28040703g^)7中我们可以看到相应的默认事件和已添加的动作列表,点击小三角可以改变触发此动作的事件,双击动作名称还可以修改添加的动作参数。
  ?牐?7.通过改变触发动作的默认事件,我们还可以将这个实例改为当浏览者离开此页面时,弹出一个提示框。我们只须简单点击改变事件的下拉三角形,从中选择“onUnload”,即当页面关闭时,弹出提示窗口(图^28040703h^8)。
  #1?牐犑道旱鲣榔鞔翱?
  ?牐犛辛松厦嬷谱鞯木椋颐腔箍梢苑奖愕卮蚩桓鲋付ù笮〉匿榔鞔翱凇7椒ㄍ厦婊纠嗨疲皇巧瓒ǖ亩鞑问灰谎?
  ?牐?1.添加元素。我们在页面中添加一个可以被点击的对象,通常我们需要一个可点击的链接,如果没有链接,我们也可以为对象添加一个“#”形式的空链接。
  ?牐?2.选中此链接文字,打开行为面板,点击添加动作的“+”按钮,设定好目标浏览器后,从行为面板中选定“Open Browser Window”,即打开一个指定大小的浏览器窗口(图^28040703i^9)。
  ?牐?3.设定浏览器的大小参数。在URL to Display文本框中,输入你希望在弹出的新窗口中显示的网页地址;在下面的两个输入框中添入新开的浏览器的宽和高;接下来在Attributes中可以详细设定你希望开启的一些选项(详细说明参照图^28040703j^10)。
  ?牐?4.设置完成后可以在行为检测器中看到默认的动作是onClick(图^28040703k^11)。
  ?牐牨嗪笥铮和ü陨狭礁黾虻ダ拥慕樯埽皇窍肴么蠹伊私庠贒reamweaver中添加行为的一般步骤,按照这个步骤还可以添加多种默认的行为。在Dreamweaver中的行为还有很多,简单的行为除了上面两种,还有Play Sound(播放声音文件),Go to URL(跳转到某个地址);Set Text(设置文本内容);稍微复杂的行为有Check Browser(检测浏览器),Change Properties(改变对象属性),Jump Menu(跳转菜单),Swap Image(交换图片);更深入的还有Drag Layer(拖曳层),Show-Hide Layers(显示隐藏层),Timeline(时间线)等等。
  ?牐犐钊肴娼樯苷庑┬形欠浅E哟蟮囊幌罟こ蹋窘坛讨皇窍敫蠹医樯芴砑有形某9娌街韬头椒ǎü约旱拿魍耆梢跃僖环慈鸩搅私庹庑┬形木咛逵猛尽4颖疚闹锌梢钥吹剑褂肈reamweaver中的行为极大的简化了各种动态效果的制作过程,普通的网页制作者不须懂得太多的编程知识也可以做出各种复杂效果。