DW12使用行为详解

《DW12使用行为详解》由会员分享，可在线阅读，更多相关《DW12使用行为详解（83页珍藏版）》请在装配图网上搜索。

1、主讲：主讲：韩维良韩维良2023年年3月月网站建设网站建设第12章使用行为第一节第一节 认识认识DreamweaverDreamweaver的行为的行为背景：JavaScript编程可以实现一些动态效果（网页中移动的广告、状态栏的文字提示），但增加了难度，DW集成了一套行为功能，便于简单地实现此类功能。行为行为：就是在特定的时间或者某个事件被触发时所产生的动作，如鼠标单击、网页加载完毕、浏览器解析出现错误等。网站建设网站建设第12章使用行为一、行为的工作原理一、行为的工作原理行为是（如用户移动鼠标到某个特定的对象上或者在某个对象上按下鼠标键等）和（即对该事件的响应）构成的。（在行为面板中看到这

2、两个方面）。从本质上讲，行为实际上是插入到网页中的一段JavaScript代码，利用这些代码实现一些动态效果。网站建设网站建设第12章使用行为1 1、对象：、对象：是产生行为的主体，大部分网页元素都可以成为对象，如：图片，文本，多媒体等，甚至网页Body主体。2 2、事件、事件：是用户的某个操作，是触发动作的原因，定义使用者的操作行为或者网页的状态。被附加到各种页面元素上；对象不同，相应的事件不同。3 3、动作、动作：由用户操作发生某个事件时，网页中通过动作代码作出响应。不同的事件对应不同的动作。网站建设网站建设第12章使用行为动作是由预先编写的JavaScript代码组成的，这些代码执行特定

3、的任务，例如打开浏览器窗口、显示或隐藏层、播放声音等。将行为附加到网页元素之后，只要对该元素发生了所指定的事件，浏览器就会调用与该事件关联的动作（JavaScript代码）。如同：面向对象编程中的事件与事件代码。另外，触发一个事件时，可以执行多个动作。如：多重链接。网站建设网站建设第12章使用行为第二节第二节 使用使用“行为行为”面板面板一、显示行为面板一、显示行为面板选择“窗口/行为”菜单，显示行为面板。网站建设网站建设第12章使用行为“行为”面板具有以下选项：是一个弹出式菜单，其中包含可以附加到的多个动作。从行为列表中删除所选的事件和动作。将特定事件的所选动作在行为列表中向上或向下移动（改

4、变行为动作的执行顺序）。网站建设网站建设第12章使用行为二、增加二、增加行为行为给元素附加行为的方法给元素附加行为的方法：选中欲添加行为的网页元素，在行为面板上单击“+”添加一个行为。再在左侧的列表中选相应的动作种类，以及该动作的具体参数。动作的默认事件显示在事件栏中，如果不是所要的事件，则在事件下拉列表中选择所需的事件。可以将动作附加到整个文档（即，在文档窗口底部左侧的标签选择器中单击标签），还可以附加到链接、图像、表单元素或多种其他HTML元素中的任何一种。网站建设网站建设第12章使用行为网站建设网站建设第12章使用行为三、删除行为三、删除行为方法：在页面中选中行为对象，在行为面板中的行为

5、列表中选择欲删除的行为，单击“-”。四、调整行为顺序四、调整行为顺序当同一个对象对应多个不同的行为时，可以调整其响应顺序。方法：在页面中选中行为对象，在行为面板中的多个行为列表中选择欲调整顺序的行为，单击“”或者“”调整顺序。网站建设网站建设第12章使用行为五、设置事件五、设置事件Dreamweaver中某个行为时会自动创建一个默认事件，默认的事件有时并不是用户需要的，比如弹出消息窗口，默认事件是Onload事件，即网页加载时弹出消息窗口，但用户如果希望单击网页后弹出消息窗口，就必须更改事件为Onclick事件。方法：单击行为列表中所选事件名称旁边的箭头，在可以触发该动作的所有事件列表中选择。

6、注意：事件和当前选择的网页对象是相关联的注意：事件和当前选择的网页对象是相关联的，因此事件下拉列表菜单中的内容随所选网页对象不同而变化。网站建设网站建设第12章使用行为网站建设网站建设第12章使用行为常见行为的触发事件及其含义常见行为的触发事件及其含义onMouseOveronMouseOver：鼠标指针移动到对象上时触发。onMouseOutonMouseOut：鼠标指针从对象上移走时触发。onMouseDownonMouseDown：按下鼠标键时触发。onMouseUponMouseUp：鼠标按键抬起时触发。onClickonClick：单击对象时触发。onDblClickonDblCli

7、ck：双击对象时触发。onLoadonLoad：指定对象装入内存时触发，通常用于Body对象。onUnLoadonUnLoad：卸载指定对象（关闭）时触发。网站建设网站建设第12章使用行为六、切换面板视图六、切换面板视图方法方法：在行为面板中单击视图切换按钮，即可在“显示设置的事件”和“显示所有事件”两种视图之间切换。行为对象切换按钮仅显示添加的事件显示所有可以添加的事件网站建设网站建设第12章使用行为第三节第三节 增加行为一般方法增加行为一般方法方法：在网页上选择一个元素，在行为面板上单击“+”添加一个行为。注意：对于纯文本不能添加行为，只有将其设置为空链接（#或者Javascript:;）

8、后，才可以添加行为。网站建设网站建设第12章使用行为第四节 浏览器事件讲解每个浏览器(不同版本)都提供一组事件，且各类型的浏览器所支持的事件和种类不同。目前现有的浏览器基本上都支持下列的事件。网站建设网站建设第12章使用行为一般事件事件事件描述描述onClick鼠标点击事件，多用在某个对象控制的范围内的鼠标点击onDblClick鼠标双击事件onMouseDown鼠标上的按钮被按下了onMouseUp鼠标按下后，松开时激发的事件onMouseOver当鼠标移动到某对象范围的上方时触发的事件onMouseMove鼠标移动时触发的事件onMouseOut当鼠标离开某对象范围时触发的事件onKeyP

9、ress当键盘上的某个键被按下并且释放时触发的事件onKeyDown当键盘上某个按键被按下时触发的事件onKeyUp当键盘上某个按键被按放开时触发的事件网站建设网站建设第12章使用行为页面相关事件事件事件描述描述onAbort图片在下载时被用户中断onBeforeUnload当前页面的内容将要被改变时触发的事件onError捕抓当前页面因为某种原因而出现的错误onLoad页面内容完成传送到浏览器时触发的事件，包括外部文件引入完成onMove浏览器的窗口被移动时触发的事件onResize当浏览器的窗口大小被改变时触发的事件onScroll浏览器的滚动条位置发生变化时触发的事件onStop浏览器的

10、停止按钮被按下时触发的事件或者正在下载的文件被中断onUnload当前页面将被改变时触发的事件网站建设网站建设第12章使用行为表单相关事件事件事件描述描述onBlur当前元素失去焦点时触发的事件onChange当前元素失去焦点并且元素的内容发生改变而触发的事件onFocus当某个元素获得焦点时触发的事件onReset当表单中RESET的属性被激发时触发的事件onSubmit一个表单被递交时触发的事件网站建设网站建设第12章使用行为滚动字幕事件事件事件描述描述onBounce在Marquee内的内容移动至Marquee显示范围之外时触发的事件onFinish当Marquee元素完成需要显示的内容

11、后触发的事件onStart当Marquee元素开始显示内容时触发的事件网站建设网站建设第12章使用行为编辑事件事件事件描述描述onBeforeCopy页面中被选择内容将要复制到浏览者系统的剪贴板前触发的事件onBeforeCut当页面中的一部分或者全部的内容将被移离当前页面剪切并移动到浏览者的系统剪贴板时触发的事件onBeforeEditFocus当前元素将要进入编辑状态onBeforePaste内容将要从浏览者的系统剪贴板传送粘贴到页面中时触发的事件onBeforeUpdate当浏览者粘贴系统剪贴板中的内容时通知目标对象onContextMenu当浏览者按下鼠标右键出现菜单时或者通过键盘的按

12、键触发页面菜单时触发的事件onCopy当页面当前的被选择内容被复制后触发的事件onCut当页面当前的被选择内容被剪切时触发的事件onDrag当某个对象被拖动时触发的事件onDragDrop一个外部对象被鼠标拖进当前窗口或者帧onDragEnd当鼠标拖动结束时触发的事件，即鼠标的按钮被释放了onDragEnter当对象被鼠标拖动的对象进入其容器范围内时触发的事件onDragLeave当对象被鼠标拖动的对象离开其容器范围内时触发的事件onDragOver当某被拖动的对象在另一对象容器范围内拖动时触发的事件onDragStart当某对象将被拖动时触发的事件onDrop在一个拖动过程中，释放鼠标键时触

13、发的事件onLoseCapture当元素失去鼠标移动所形成的选择焦点时触发的事件onPaste当内容被粘贴时触发的事件onSelect当文本内容被选择时的事件onSelectStart当文本内容选择将开始发生时触发的事件网站建设网站建设第12章使用行为数据绑定事件事件事件描述描述onAfterUpdate当数据完成由数据源到对象的传送时触发的事件onCellChange当数据来源发生变化时onDataAvailable当数据接收完成时触发事件onDatasetChanged数据在数据源发生变化时触发的事件onDatasetComplete当来子数据源的全部有效数据读取完毕时触发的事件onErr

14、orUpdate当使用onBeforeUpdate事件触发取消了数据传送时，代替onAfterUpdate事件onRowEnter当前数据源的数据发生变化并且有新的有效数据时触发的事件onRowExit当前数据源的数据将要发生变化时触发的事件onRowsDelete当前数据记录将被删除时触发的事件onRowsInserted当前数据源将要插入新数据记录时触发的事件网站建设网站建设第12章使用行为外部事件事件事件描述描述onAfterPrint当文档被打印后触发的事件onBeforePrint当文档即将打印时触发的事件onFilterChange当某个对象的滤镜效果发生变化时触发的事件onHel

15、p当浏览者按下F1或者浏览器的帮助选择时触发的事件onPropertyChange当对象的属性之一发生变化时触发的事件onReadyStateChange当对象的初始化属性值发生变化时触发的事件网站建设网站建设第12章使用行为第五节第五节 使用使用Dreamweaver CS5Dreamweaver CS5预定义行为预定义行为一、交换图像和恢复交换图像一、交换图像和恢复交换图像“交换图像”行为通过改变标签的src属性将一幅图像替换成为另外一幅图像。使用此行为可以创建鼠标经过按钮的效果。方法：在文档中插入一副图像，属性面板的“ID”文本框中输入图像的ID以便识别；选择要交换的图像，在行为面板单击

16、“添加行为（+）”按钮，在弹出的下拉菜单中选择“交换图像”命令，在交换图像对话框中指定交换的图像。网站建设网站建设第12章使用行为鼠标移开时恢复鼠标移入时交换网站建设网站建设第12章使用行为图像图像：选择一个需要改变其源文件的图像。设定原始档为设定原始档为：输入新图像的文件路径和名称，或者点击“浏览”按钮选取一个新的图像文件。预先载入图像预先载入图像：选择此项可以将新图像预先加载到浏览器缓存中，防止图像延迟。鼠标滑开时恢复图像鼠标滑开时恢复图像：用于自动创建交换图像的行为完成后，以相反的事件恢复原状。如鼠标移入图像上时交换，移开后恢复。网站建设网站建设第12章使用行为注意：在交换图片时，最好使

17、用与原始尺寸相同的图像进行交换。否则，替换的图像为了适应原图片的大小（宽度和高度）显示时会出现不必要的变形，比如被压缩或扩展。例：将素材中的tam01.jpg与tam02.jpg两副图片设置图像交换。另外，再设置取消鼠标滑开时恢复图像鼠标滑开时恢复图像选项。网站建设网站建设第12章使用行为二、弹出信息二、弹出信息应用应用“弹出信息弹出信息”行为的方法行为的方法：选择一个事件对象（链接、图象、导航按钮或整个文档“Body”），在“行为”面板上，单击加号（+）按钮并从“动作”弹出菜单中选择“弹出信息”。在“弹出信息”对话框中，“信息”域中输入要显示的信息，如“欢迎光临”等。单击“确定”按钮，关闭设

18、置对话框。通常显示如：浏览器的分辨率要求，购卖信息。网站建设网站建设第12章使用行为网站建设网站建设第12章使用行为三、打开新浏览器窗口三、打开新浏览器窗口打开浏览器窗口即在打开当前网页的同时，另外打开一个新的窗口显示一个指定的网页，可根据需要对它的菜单、页面尺寸、滚动条等进行设置。如：CH09中的弹出式广告。添加添加“打开浏览器窗口打开浏览器窗口”行为方法行为方法：选择一个事件对象（图像、超链接或body等）并打开“行为”面板。单击加号（+）按钮并从“动作”列表中选择“打开浏览器窗口”。网站建设网站建设第12章使用行为在“要显示的URL”域中输入要显示网页的URL或通过“浏览”按钮选择一个要

19、显示的网页文件。另外设置窗口大小以及其它内容的显示与否等。网站建设网站建设第12章使用行为注意给文本添加行为时，要注意将其设置为超级链注意给文本添加行为时，要注意将其设置为超级链接接#，否则很多行为都无法添加。，否则很多行为都无法添加。窗口宽度窗口宽度：指定窗口的宽度（以像素为单位）。窗口高度窗口高度：指定窗口的高度（以像素为单位）。属性属性：选择是否在新的浏览器窗口中包含：导航工具栏、地址工具栏、状态栏、菜单条、滚动条、调整大小手柄等内容。窗口名称窗口名称是新窗口的名称。制作Click图像册（单击缩略图，显示大图）。制作load招聘启事，广告（Body 的load事件中添加打开浏览器行为是一

20、个好的操作）。网站建设网站建设第12章使用行为四、拖动四、拖动APAP元素元素拖动AP元素行为可以允许在页面上拖动AP元素。方法：选择对象，在行为面板上单击“+”，在行为的动作列表中选择“拖动AP元素”。例：制作案例(CH09)中的拼图页面。先演示效果。网站建设网站建设第12章使用行为设计步骤：先建立7个AP DIV层，并分别将每一个拼块置于一个层中，调整层的大小，使图片刚好容纳其中，（可先让层的大小大于图片大小，再调整其大小，但层的大小不能小于图片，否则拖动时有些区域不能拖）。对照原始图片，将各层排列到一起，形成完整图片。选中Body，添加“拖动AP元素”，为每个层(列表选)逐一设置拖动层效

21、果，为其Onload事件添加行为。网站建设网站建设第12章使用行为选中Body对象，添加行为；“层”列表中选择被拖动的对象层。取得当前位置使得当对象被置于该位置并在“靠近距离”范围内时，会自动归位。网站建设网站建设第12章使用行为在高级选项卡中，提示拖动结果，加代码：alert(唔,还不错哟!)如果没有添加拖动层行为，层是不能被拖动的。网站建设网站建设第12章使用行为再建立一个层，用于放置操作提示文本！注意：将层的标签类型由DIV改为SPAN后（选中多个层，再在属性面板上改），层的边界不显示。网站建设网站建设第12章使用行为五、改变属性五、改变属性“改变属性”行为可以动态改变某一对象的属性值。

22、方法：选择对象，在行为面板上单击“+”，在行为的动作列表中选择“改变属性”。在对话框中确定欲改变的对象类型和对象的属性。如改变一个层的背景颜色（backgroundcolor）。网站建设网站建设第12章使用行为实例：使用改变属性制作图片阴影效果（如CH09实例中的“改变属性.htm”演示）1实例创意大多数行为的属性都可以修改，而且这些行为的显示效果取决于所使用的浏览器，本实例将实现图片阴影效果的功能，当鼠标移至图片上时，阴影效果显示，当鼠标离开图片时，阴影效果消失。网站建设网站建设第12章使用行为2制作步骤（1）新建网页，保存页面，在该页面中插入一个层，将图片flower.jpg插入到该层中，

23、调整图层大小，使图层比图像略大一点所示。网站建设网站建设第12章使用行为（2）选择图像后，在行为选择菜单中选择“改变属性”命令。网站建设网站建设第12章使用行为（3）在弹出的对话框中作如图所示的选择本例效果是改变“Layer1”的背景色彩。网站建设网站建设第12章使用行为（4）为了得到阴影效果，在“新的值”框中输入“black”，当然也可以输入其他色彩名称或代码。网站建设网站建设第12章使用行为（5）默认的事件是“onload”，在这里用鼠标单击其右方的黑三角，在弹出的下拉选项中选择“onMouseOver”（鼠标经过)。网站建设网站建设第12章使用行为（6）用同样的方法添加行为，再在Move

24、out事件时设置为白色。（7）保存网页后，按F12预览，如图示：当鼠标经过图片时，图片显示阴影效果。网站建设网站建设第12章使用行为六、显示六、显示-隐藏元素隐藏元素显示-隐藏层可以对页面中所有的层进行设置，使其可显示或隐藏。可通过显示-隐藏层的功能制作一个网页中常见的导航用下拉菜单。其实质是网页中共有多个菜单，分别对应有多个层，每一层即一个下拉菜单，网页加载时，这多个层全部隐藏，当鼠标移动到某菜单上时，对应层显示，并可单击其中的超链接，而其它层隐藏。网站建设网站建设第12章使用行为方法：选择行为对象（如文字链接），在行为面板上单击“+”，在行为的动作列表中选择“显示隐藏层”，选中某一层，单击

25、“显示”，选中其它层，单击“隐藏”，逐一设置多个层。，其中菜单项都在层中，这种菜单很实用。如青海大学的主页（用IE打开）。网站建设网站建设第12章使用行为步骤：设置页面的导航条，并添加各层及相应层中的超链接。在Body的load事件中，隐藏所有层。再在导航条或菜单项的单击或越过事件中选择显示相应的层菜单。（显示一个，隐藏其它）注意：每一个菜单项的文字须是虚链接方可添加“显示隐藏层”行为。而在每一个层中又以表格布局添加相应的超级链接。这种菜单比较常用。网站建设网站建设第12章使用行为七、检查插件七、检查插件使用“检查插件”行为根据访问者是否安装了指定的插件这一情况将他们发送到不同的页。方法：选择

26、一个事件对象（链接、图片、body等）并打开“行为”面板。单击加号（+）按钮并从“动作”弹出式菜单中选择“检查插件”。从“插件”弹出式菜单中选择一个插件，或单击“输入”并在相邻的域中键入插件的确切名称。网站建设网站建设第12章使用行为在“如果有，前往如果有，前往URLURL”域中，为具有该插件的访问者指定一个URL。如果指定一个远程URL，则必须在地址中包括“http:/”前缀。在“否则，前往否则，前往URLURL”域中，为不具有该插件的访问者指定一个替代URL。若要让不具有该插件的访问者留在同一页上，将此域留空。通常，如果插件内容对于您的页面是必不可少的一部分，请选择“如果无法检测，总是转到

27、第一个 URL”选项，浏览器通常会提示不具有该插件的访问者下载该插件。如果插件内容对于您的页面不是必要的，请保留此选项的未选中状态。网站建设网站建设第12章使用行为八、设置文本八、设置文本1 1设置容器的文本设置容器的文本“设置容器的文本”动作允许将网页中某容器的文本动态替换为特定的内容。前提：为欲设置文本的每一个容器对象（某一个完整的标签）设置一个唯一的ID属性。方法：选中欲设置文本的容器对象，单击“行为”面板上加号（+）按钮，选择“设置文本”中的“设置容器的文本”。网站建设网站建设第12章使用行为例：将一个段落标签的内容替换为一张图片。新建一个页面，输入两行文本:“设置容器的文本”、“请单

28、击我看看发生什么”，前者设置为H1标题，后者设置一个段落，并设置ID为p1。选中p1段落，单击“行为”面板上加号（+）按钮，设置容器中的文本如下：再将事件改为Click；被替容器对象被替容器对象替换内容替换内容网站建设网站建设第12章使用行为网站建设网站建设第12章使用行为2 2设置文本域文本设置文本域文本“设置文本域文本”行为可用指定的内容替换表单中文本域的内容。方法：选中欲设置文本的文本域，单击“行为”面板上加号（+）按钮，选择“设置文本”中的“设置文本域文本”。例：建立一个输入用户名的文本域，ID名为：Username，设计如下页中的图所示，设置文本域文本行为，当该文本域获得焦点时，清空

29、文本域的内容，输入具体的用户名。网站建设网站建设第12章使用行为此处为空在事件列表中更改触发的事件为OnFocus网站建设网站建设第12章使用行为3 3设置状态栏文本设置状态栏文本“设置状态栏文本”动作可在浏览器窗口底部左侧的状态栏中显示特定的文本。方法：选中欲添加行为的对象（如Body），单击“行为”面板上加号（+）按钮，选择“设置文本”中的“设置状态栏文本”。如：Body标签的load事件中设置状态栏文本，将状态栏的内容自己期望的文本内容。网站建设网站建设第12章使用行为4 4设置框架文本（设置框架文本（*）“设置框架文本”动作允许动态设置框架的文本，用指定的内容替换框架的内容和格式设置。

30、可以先获取当前框架中的内容，再设置新的内容；另外可用HTML标签设置格式。用指定的内容替换框架中原有的内容。被替换对象被替换对象替换内容替换内容网站建设网站建设第12章使用行为九、调用九、调用JavaScriptJavaScript调用JavaScript行为触发时用于调用一段JavaScript代码或者函数。方法：选择一个事件对象（文本链接、图片、body等），在“行为”面板中单击加号（+）按钮，从“动作”弹出式菜单中选择“调用JavaScript”。如：网页中输入“关闭窗口”文本，选中对其设置调用JavaScript代码为：window.close()，对应事件为：Onclick。即可在单

31、击时关闭本窗口。网站建设网站建设第12章使用行为十、跳转菜单（十、跳转菜单（*）通过跳转菜单，可以使访问者从由多个链接列表中选择一项，跳转到其他页面。如友情链接。当空间有限，但需要显示许多链接项或需要把链接项集中归类时，跳转菜单非常有用。使用跳转菜单行为，先通过表单对表插入一个跳转菜单。网站建设网站建设第12章使用行为2023年3月1日星期三教育学院方法：首先将插入点放在要插入跳转菜单的位置。单击“插入”面板中“表单”中的“跳转菜单”工具 ，或者“插入”菜单的“表单”中的“跳转菜单”。61网站建设网站建设第12章使用行为跳转菜单行为用于对跳转菜单进行编辑修改。方法：选中建立的跳转菜单，在行为面

32、板中双击“跳转菜单”项，即可对其跳转菜单进行进一步的修改。可以改变菜单顺序，可以增减菜单项以及具体某一项的内容等网站建设网站建设第12章使用行为十一、跳转菜单开始（十一、跳转菜单开始（*）跳转菜单开始是对跳转菜单功能的一种扩展，一般情况下，当在跳转菜单中单击选择某一项后，自动转移到指定的链接。或者选择某一项后，单击“前往”按钮即可；但是有时希望在跳转菜单中选择某一项，再单击某个对象时，再实现跳转，这时可用跳转菜单开始行为。方法：选择一个事件对象（文本链接、图片等），在“行为”面板中单击加号（+）按钮，从“动作”弹出式菜单中选择“跳转菜单开始”。添加跳转菜单行为后，跳转菜单在行为列表中原有的行为

33、被删除，而是加了跳转菜单开始行为。选择欲开始的跳转菜单，单击确定即可实现相应的功能。网站建设网站建设第12章使用行为网站建设网站建设第12章使用行为十二、转到十二、转到URLURL当行为被触发时，可将直接跳转到指定的URL上。方法：选择一个事件对象（文本、图片等），在“行为”面板中单击加号（+）按钮，从“动作”弹出式菜单中选择“转到URL”。如同打开浏览器窗口行为，可以给一个对象添加多个该行为。网站建设网站建设第12章使用行为十三、隐藏弹出式菜单十三、隐藏弹出式菜单(略略)在CS5中没有此项功能。网站建设网站建设第12章使用行为十四、预先载入图像十四、预先载入图像对于类似交换图像类的行为，在显

34、示图像前，需要先载入图像，等需要时直接显示。方法：选择一个事件对象（文本、图片等），在“行为”面板中单击加号（+）按钮，从“动作”弹出式菜单中选择“预先载入图像”。分别设置需要预先载入的图像文件。网站建设网站建设第12章使用行为第六节第六节 管理行为管理行为一、更新行为一、更新行为已经设置的行为，可以改变动作参数。方法：双击欲修改行为对应的“动作”栏，在该动作的参数设置对话框中修改各项参数。添加行为按钮删除行为按钮事件列表多动作时，可用来调整先后次序双击可设置参数网站建设网站建设第12章使用行为二、排序行为二、排序行为一个事件可以触发多个动作，比如Onload这一事件可以触发如播放声音，打开浏

35、览器窗口等动作。在这种情况下就存在一个动作发生的先后问题，可以通过单击行为面板中“”，“”按钮来解决这个问题。网站建设网站建设第12章使用行为三、删除行为三、删除行为在行为面板上选取欲删除的行为，单击行为面板左上方的“-”按钮，或按Delete键。网站建设网站建设第12章使用行为四、获取第三方行为四、获取第三方行为方法：在“行为”面板中单击加号（+）按钮，从“动作”弹出式菜单中选择“获取第三方行为”。在网站中获取。网站建设网站建设第12章使用行为2023年3月1日星期三教育学院第七节第七节 定义定义SprySpry效果效果Dreamweaver中的Spry功能是由JavaScript定义的，类

36、似于函数调用，用于拓展DW的功能，由四个部分组成：Spry构件。Spry验证表单。Spry XML数据显示。Spry特效。在Dreamweaver中Spry动画效果主要增强视觉效果，效果行为可应用于使用JavaScript的HTML页面上的几乎所有元素。通常用于在一段时间内高亮显示信息，创建动画过渡或以可视方式修改页面元素。网站建设网站建设第12章使用行为2023年3月1日星期三教育学院Spry动画效果可以修改元素的不透明、缩放比例、位置和样式属性（如背景颜色），还可以组合两个或多个属性来创建有趣的视觉效果。要对某个元素应用效果，必须使该元素处于选定状态，或该元素已指定一个ID。当使用效果时，

37、系统会在“代码”视图中将不同的代码行添加到您的文件中。其中用来标识SpryEffects.js文件包含所有Spry效果所必须的JavaScript脚本库。请不要从代码中删除该行，否则这些效果将不起作用。网站建设网站建设第12章使用行为2023年3月1日星期三教育学院Spry效果包括显示/渐隐、高亮颜色、遮帘、滑动、增大/收缩、晃动、挤压等动画效果，它可以设置元素的不透明、缩放比例、位置和样式属性（如背景颜色），还可以组合两个或多个属性来创建有趣的视觉效果。由于这些效果都基于Spry，因此，当单击应用了效果的对象时，只有对象会进行动态更新，不会刷新整个HTML页面。网站建设网站建设第12章使用行

38、为2023年3月1日星期三教育学院一、显示渐隐效果一、显示渐隐效果利用该Spry效果，可以使元素产生淡淡显示或隐藏的动画效果。新建一个页面文档，插入一幅图像并选中该图像。单击行为面板上的“+”按钮，从弹出菜单中选择“效果显示/渐隐”，弹出“显示/渐隐”对话框，如图所示。网站建设网站建设第12章使用行为Click事件或者Load事件渐隐自、渐隐到、显示自、显示到文本框中是对象透明的比例。选中“切换效果”选项时，如果选择了单击事件，则不断地单击后，可在显示与渐隐中切换。网站建设网站建设第12章使用行为2023年3月1日星期三教育学院二、遮帘效果（卷帘效果）二、遮帘效果（卷帘效果）利用该Spry效果

39、，可以模拟百叶窗，产生向上或向下滚动百叶窗来隐藏或显示元素的动画效果。新建一个页面文档，插入一个Div标签，并在Div标签中插入图像和说明性文字。选中Div标签单击行为面板上的“+”按钮，从弹出菜单中选择“效果遮帘”，弹出“遮帘”对话框，如图所示。网站建设网站建设第12章使用行为Click事件或者Load事件向上遮帘自、向上遮帘到文本框中是对象剩余的比例。选中“切换效果”选项时，如果选择了单击事件，则不断地单击后，可在向上与向下中切换。适用于：Div、Hn、P、DD、Dt等标签。如要用于图像，先将置于Div中。网站建设网站建设第12章使用行为2023年3月1日星期三教育学院三、增大收缩效果三、

40、增大收缩效果利用该Spry效果，可以使元素产生变大或变小动画效果。此效果适用于下列HTML对象：Img、address、dd、div、dl、dt、form、p、ol、ul、applet、center、dir、menu或pre。新建一个页面文档，插入一幅图像并选中该图像。单击行为面板上的“+”按钮，从弹出菜单中选择“效果增大/收缩”，弹出“增大/收缩”对话框，如图所示。放大缩小的比例网站建设网站建设第12章使用行为2023年3月1日星期三教育学院四、高亮颜色效果四、高亮颜色效果利用该Spry效果，可以使元素产生颜色渐变的动画效果。新建一个页面文档，在页面绘制一个APDiv，设置其背景色为任一颜色

41、。选中该APDiv单击行为面板上的“+”按钮，从弹出菜单中选择“效果/高亮颜色”，弹出“高亮颜色”对话框，如图所示。网站建设网站建设第12章使用行为2023年3月1日星期三教育学院五、晃动效果五、晃动效果利用该Spry效果，可以模拟从左向右晃动元素的动画效果。新建一个页面文档，插入一幅图像并选中该图像。单击行为面板上的“+”按钮，从弹出菜单中选择“效果/晃动”，弹出“晃动”对话框，如图所示。网站建设网站建设第12章使用行为2023年3月1日星期三教育学院六、挤压效果六、挤压效果利用该Spry效果，可以使元素产生从页面左上角消失的动画效果。新建一个页面文档，插入一幅图像并选中该图像。单击行为面板上的“+”按钮，从弹出菜单中选择“效果/挤压”，弹出“挤压”对话框，如图所示。网站建设网站建设第12章使用行为2023年3月1日星期三教育学院七、滑动效果七、滑动效果利用该Spry效果，可以产生上、下移动元素的动画效果。此效果适用于下列HTML对象：blockquote、dd、div、form或center。滑动效果要求在要滑动的内容周围有一个标签。选中Div标签单击行为面板上的“+”按钮，从弹出菜单中选择“效果/滑动”，弹出“滑动”对话框，如图所示。