19使用行为制作动感网页与特效.ppt

本章/节学习重点 上期回顾 教学目的 了解行为的基本知识与作用 使用Dreamweaver 8自带行为 重点 使用行为的制作网页特效 难点 行为的事件 本次小结 行为概述 行为介绍 行为是将 Java Script 代码放置在文档中以允许访问者与 Web 页进行交互。用户只需用鼠标点击进行简单的设定就可以实现复杂的动态网页的效果。 行为是事件和由该事件触发的动作的组合。其中： 动作是由预先编写的 JavaScript 代码组成的，这些代码执行特定的任务，例如打开浏览器窗口、显示或隐藏层、播放声音或停止 Shockwave 影片等等。 事件是浏览器生成的消息，指示页面的访问者执行了某种操作。例如，当访问者将鼠标指针移动到某个链接上时，浏览器为该链接生成一个 onMouseOver 事件，然后浏览器查看是否存在应该调用的 JavaScript 代码。 行为概述 系统为不同的页面元素定义不同的事件。将一个动作和一个事件结合在一起就完成了一个行为的过程。例如我们在网页的载入事件中响应一个弹出对话框的动作，其对应的事件为Onload，对应的动作为“弹出信息”，经过简单的设定就可以完成需要的功能。如下图所示。 认识事件 每个浏览器都提供一组事件，这些事件可以与“行为”面板的“+”按钮中弹出的行为相关联。 大多数事件只能用于特定的页面元素。若要查明对于给定的页面元素给定的浏览器支持哪些事件，可在文档中插入该元素并向其附加一个行为，然后单击“行为”面板中事件右侧的按钮，查看事件弹出式菜单。 行为面板 “行为”面板如右图所示： 添加行为按钮：单击此按钮将弹出可以显示行为的菜单，当选择了其中一个行为后会弹出响应的设置对话框。 删除行为按钮：单击此按钮将删除当前选中的行为。 事件更改按钮：单击此按钮将弹出事件菜单，从中进行选择以更换触发动作的事件类型。如果菜单中未列出所需的事件，可在“显示事件”弹出的子菜单中更改目标浏览器。 添加行为 （1）选中一个网页中的对象。 （2）单击添加行为按钮，在弹出的菜单中选中你希望添加的行为。 （3）单击所选行为，在弹出的对话框中进行设置。 （4）在行为面板中，单击事件更改按钮，在弹出的下拉菜单中选择你需要的触发事件类型。 编辑管理行为 “行为”面板的约定： （１）行为面板中有多个行为时，则按事件的字母顺序显示在面板上。 （２）同一个事件可以有多个动作，对于同一个事件的多个动作，行为面板中的显示顺序就是多个动作的执行顺序。 （３）要想调整动作的执行顺序，可以利用行为面板的按钮 和 来调整，以实现所需要的效果。 使用自带的行为 交换图像　　 使用“交换图像”行为，可以改变img标签的src属性，即用另一张图像替代当前的图像。对话框如图所示。 使用自带的行为 弹出信息 使用“弹出信息”行为，可以显示一个带有用户指定消息的 JavaScript 警告。因为 JavaScript 警告只有一个按钮（“确定”），所以使用此动作可以提供信息，而不能为用户提供选择。对话框如图所示。 使用自带的行为 打开浏览器窗口 使用“打开浏览器窗口”行为，可以实现当用户在触发所定义的事件时打开一个新的浏览器窗口，在新的窗口中可以载入指定URL地址上的网页。对话框如图所示。 使用自带的行为 拖动图层　 使用“拖动层”行为，可以实现访问者在页面上拖动图层。一般是使用 onLoad 事件将“拖动层”附加到 body 对象上。对话框如图所示。 使用自带的行为 “放下目标”的左和上文本框中输入以像素为单位的放置目标的值。 “靠齐距离”文本框中输入一个以像素为单位的值，指定图层与放置目标的靠近距离。　　 如果还要定义图层的拖动柄等动作，可以单击【高级】标签。 使用自带的行为 控制Shockwave或Flash　　 使用“控制 Shockwave 或 Flash”行为，可以控制Macromedia Shockwave 或 Macromedia Flash SWF文件的播放、停止、倒带或转到文件中的帧。对话框如图所示： 使用自带的行为 播放声音　 使用“播放声音”作为，可以很方便的在网页中加入音乐。对话框如图所示。 使用自带的行为 改变属性 使用“改变属性”行为，可以通过设定的事件触发行为，动态改变连接行为的对象属性，包括对象的颜色、尺寸和背景等。 “改变属性”对话框，如图 所示。 使用自带的行为 时间轴　 使用“停止时间轴”/“播放时间轴”/“转到时间轴帧”行为，可以实现控制时间轴的停止、播放或转到时间轴指定帧开始播放时间轴 。对话框如图所示。 使用自带的行为 显示－隐藏层　在第七章第2节已讲过 P129 此处不再详述 使用自带的行为 显示弹出菜单 使用“显示弹出菜单”行为，可以创建或编辑 D