东北大学,网站设计,,第5 章 行为和层应用.pptVIP

网站设计第5章 行为与层 冯国奇 gqfeng@mail.neu.edu.cn Dreamweaver 行为的基本概念 行为（Behaviors）是响应某一事件（Event）而采取的一个动作（Action）。它实质上是网页中调用Javascript代码，以实现网页的动态效果，使用了Dreamweaver 的行为功能，就不需要掌握复杂的Javascript代码而轻松完成一个需要几十行甚至几百行代码才能完成的功能。 行为面板 网页中的事件（Event）是指鼠标、键盘的响应方法，Dreamweaver 提供了许多常用的事件。 启动Dreamweaver ，单击“【窗口】→【行为】”菜单命令或按Shift+F3键，系统打开“行为”面板，如图所示。 “行为”面板主要项目功能如下： 加（+）减（—）按钮：用于添加或删除动作（Actions）。 动作：是网页产生的具体行为，如上图设置将产生网页时弹出一个信息窗口的网页效果。 事件：当选定某个动作时，事件右侧出现一个箭头，按此箭头产生一个事件处理的下拉菜单，通过下拉菜单可选择触发动作发生的条件，以下是常见事件及描述。 OnClick：当访问者在指定的元素上单击时产生。 onDblClick：当访问者在指定的元素上双击时产生。 onKeyDown：当按下任意键的同时产生。 onKeyPress：当按下和松开任意键时产生。此事件相当于把onKeyDown和onKeyUp这两事件合在一起。 3．常用事件 设定行为命令 在对象中加入行为命令 Dreamweaver 使用行为，应使用以下一般操作步骤： （1）选择一个想要添加行为的网页元素（可以借助状态栏中的标记符选择器，例如选择body可为整个网页设置行为）。 （2）选择“【窗口】→【行为】”菜单命令，打开“行为”面板。 （3）单击添加行为按钮,并弹出一个菜单。 （4）在菜单中选择一个动作，系统弹出该动作的设置对话框，显示动作的参数和说明。输入动作的相关参数后单击“确定”按钮。 （5）回到行为面板，此时行为面板中增加了一个行为行，如图所示。 编辑行为 为对象添加行为后，有时需要改变触发行为的事件，增加、删除动作或改变动作参数等，这些都属于编辑行为的操作。 1．更改事件 Dreamweaver MX 2004中设置动作时会自动创建一个事件，默认的事件有时并不是用户需要的，比如弹出消息窗口，默认事件是Onload事件，即网页加载时弹出消息窗口，但用户如果希望单击网页后弹出消息窗口，就必须更改事件为Onclick事件。 操作方法为单击“事件”栏，再单击事件旁边的 按钮，在事件下拉列表菜单中选择Onclick事件，如图所示。事件和当前选择的网页对象是相关联的，因此事件下拉列表菜单中的内容随所选网页对象不同而变化。 如果在选择了正确的网页对象后，发现所期望的事件并没有出现在事件列表菜单中，这时应尝试改变浏览器。方法是单击“+”按钮，在图所示的弹出菜单中选择“显示事件”命令，在子菜单中选择浏览器的版本，浏览器的版本越高，支持的事件越多。默认情况下，事件列表菜单中显示的都是IE4.0能够产生的事件。当找到所期望的事件后，选择该事件，对应行为面板的相应事件将会改变。 2．修改行为的动作参数 已经设置的行为，可以改变动作参数。只要双击该行为对应的“动作”栏，如图所示，即可打开该动作的参数设置对话框，在对话框中修改各项参数。 3．删除行为 在行为面板上选取欲删除的行为，单击行为面板左上方的“-”按钮，或按Delete键。 4．调整行为的执行顺序 一个事件可以触发多个动作，比如Onload这一事件可以触发如播放声音，打开浏览器窗口等动作。在这种情况下就存在一个动作发生的先后问题，可以通过单击行为面板中“▲”，“▼”按钮来解决这个问题，如图 创建行为实例 实例：弹出信息框 1．实例创意 网页加载时弹出信息框，如图示，或点击一个对象弹出信息框，比如点击图片，按钮，链接等等，都可以弹出信息框。如果某些页面的内容在别人复制之前想给一点提示，还可以选择OnCopy事件来触发弹出信息框动作。 2．制作步骤 方法一：调用JavaScript 使用这一行为，必须对JavaScript非常熟悉。本例中调用JavaScript的操作主要用于对整个页面的作用，即网页加载时弹出信息框，因此在插入这个行为时，按以下步骤操作： （1）在行为选择菜单中选择“调用JavaScript”命令，如图所示。 （2）弹出如图所示的“调用Javascript”对话框，在文本框中输入需要执行的准确