第12章 使用行为和Spry构件.pptVIP

本章将介绍行为和Spry构件的基本知识和使用方法。 * 第12章 使用行为和Spry构件 学习目标 了解行为的基本概念。 了解常用事件和动作。 掌握应用和修改行为的方法。 掌握Spry构件的应用方法。 12.1 认识行为 行为和【行为】面板 事件和动作 12.1.1 行为和【行为】面板 行为是由事件（Event）触发的动作（Action），因此行为的基本元素有两个：事件和动作。事件是浏览器产生的有效信息，也就是访问者对网页进行的操作。例如，当访问者将鼠标光标移到一个链接上，浏览器就会为这个链接产生一个“onMouseOver”（鼠标经过）事件。然后，浏览器会检查当事件为这个链接产生时，是否有一些代码需要执行，如果有就执行这段代码，这就是动作。动作是由JavaScript代码组成的，这些代码执行特定的任务。 不同的事件为不同的网页元素所定义。例如，在大多数浏览器中，“onMouseOver”（鼠标经过）和“onClick”（单击）是和链接相关的事件，然而“onLoad”（载入）是和图像及文档相关的事件。一个单一的事件可以触发几个不同的动作，而且可以指定这些动作发生的顺序。 12.1.1 行为和【行为】面板 在文档窗口中，选择【窗口】/【行为】命令，可以打开【行为】面板。 12.1.2 事件和动作 事件决定了为某一页面元素所定义的动作在什么时候执行。需要注意的是不同版本的浏览器所支持的事件类型也不同。 12.2 应用行为 弹出信息 打开浏览器窗口 调用JavaScript 改变属性 交换图像 跳转菜单 预先载入图像 转到URL 拖动AP元素 Spry效果 12.2.1 弹出信息 【弹出信息】行为将显示一个指定的JavaScript提示信息框。 12.2.2 打开浏览器窗口 使用【打开浏览器窗口】行为将打开一个新的浏览器窗口，在其中显示所指定的网页文档。设计者可以指定这个新窗口的属性，包括窗口尺寸、是否可以调节大小、是否有菜单栏等。 12.2.3 调用JavaScript 【调用JavaScript】行为能够让设计者使用【行为】面板指定一个自定义功能，或者当一个事件发生时执行一段JavaScript代码。设计者可以自己编写JavaScript代码。 12.2.4 改变属性 【改变属性】行为用来改变网页元素的属性值，如文本的大小、字体，层的可见性，背景色，图片的来源以及表单的执行等。 12.2.5 交换图像 【交换图像】行为可以将一个图像替换为另一个图像，这是通过改变图像的“src”属性来实现的。在前一节中可以通过为图像添加【改变属性】行为来改变图像的“src”属性，不过【交换图像】行为更加复杂一些，可以使用这个行为来创建翻转的按钮及其他图像效果（包括同时替换多个图像）。 12.2.6 跳转菜单 跳转菜单相当于在菜单域的基础上又增加了一个按钮，但是，一旦在文档中插入了跳转菜单，就无法再对其进行修改了。如果要修改，只能将菜单删除，然后再重新创建一个，这样做非常麻烦。而Dreamweaver所设置的【跳转菜单】行为，其实就是为了弥补这个缺陷。 12.2.7 预先载入图像 【预先载入图像】行为可以将不会立即出现在网页上的图像预先载入浏览器缓存中。这样可防止需要图像出现时再去下载而导致延迟，还便于脱机使用。 12.2.8 转到URL 【转到URL】行为可以在当前窗口或指定的框架中打开一个新页面。此操作对通过一次单击修改两个框架或多个框架的内容非常适用。 12.2.9 拖动AP元素 如果使用了【拖动AP元素】行为，就可以制作出能让浏览者任意拖动的对象。不过，在开始制作前，需要在页面中先添加AP Div，并在其中添加图像或文本。 12.2.10 交换图像 “Spry效果”是视觉增强功能，几乎可以将它们应用于使用JavaScript的HTML页面上的所有元素。设置该效果通常可以在一段时间内高亮显示信息、创建动画过渡或者以可视方式修改页面元素。可以将效果直接应用于HTML元素，而无需其他自定义标签。 要使某个元素应用效果，该元素必须处于当前选定状态，或者必须具有一个Id。例如，如果要向当前未选定的Div标签应用高亮显示效果，该Div必须具有一个有效的Id值。如果该元素尚且没有有效的Id值，需要在HTML代码中添加一个。 利用该效果可以修改元素的不透明度、缩放比例、位置和样式属性（如背景颜色），也可以组合两个或多个属性来创建有趣的视觉效果。 由于这些效果都基于Spry，因此，当用户单击应用了效果的对象时，只有对象会进行动态更新，不会刷新整个HTML页面。 12.2.10 交换图像 “Spry效果”是视觉增强功能，几乎可以将它们应用于使用JavaScript的HTML页面上的所有元素。设置该效果通常可以在一段时间内高亮显示信息、创建动画过渡或者以