《第6章 时间轴和行为课件.ppt》由会员分享,可在线阅读,更多相关《第6章 时间轴和行为课件.ppt(53页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、第第6 6章章 时间轴和行为时间轴和行为 6.1 【案例【案例3333】“体育世界体育世界”网页网页 6.2 【案例【案例3434】添加游动广告的】添加游动广告的“体育世界体育世界”网页网页 6.3 【案例【案例3535】“跟我学计算机跟我学计算机”网页网页调出式菜单调出式菜单 6.4 【案例【案例3636】“北京名胜北京名胜1”网页网页交替变化图像交替变化图像 6.5 【案例【案例3737】“北京名胜北京名胜2”网页网页弹出窗口弹出窗口 6.6 【案例【案例3838】“图像链接翻转图像链接翻转”网页网页 6.7 【案例【案例3939】“跟我学制作表单跟我学制作表单”网页(二)网页(二) 6.
2、8 【案例【案例4040】“控制播放控制播放Flash动画和动画和MIDI音乐音乐”网网页页 6.9 【案例【案例4141】“活动菜单活动菜单”网页网页 6.10 【案例【案例4242】“拼图拼图”网页网页 6.1 【案例【案例3333】“体育世界体育世界”网页网页1“时间轴时间轴”面板面板单击单击“窗口窗口”“时间轴时间轴”菜单命令或按【菜单命令或按【Alt+F9】组合键,即可调出】组合键,即可调出“时时间轴间轴”面板,如图面板,如图6-1-4所示。该面板中的各个工具及其他选项的作用如下。所示。该面板中的各个工具及其他选项的作用如下。(1)“时间轴时间轴”下拉列表框:其内列出了当前页面内所有
3、时间轴动画的名字,下拉列表框:其内列出了当前页面内所有时间轴动画的名字,选中其中一个选项后,相应的动画就会在选中其中一个选项后,相应的动画就会在“时间轴时间轴”面板中显示出来。右击面板中显示出来。右击“时间轴时间轴”面板内部,调出面板内部,调出“时间轴时间轴”快捷菜单,单击该菜单中的快捷菜单,单击该菜单中的“添加时添加时间轴间轴”菜单命令,即可在菜单命令,即可在“时间轴时间轴”下拉列表框内添加一个新的时间轴动画下拉列表框内添加一个新的时间轴动画(默认名称为(默认名称为“Timeline”+序号)。序号)。(2)回放头:播放动画时,它在时间标尺上移动,好像放像机的磁头一样。)回放头:播放动画时,
4、它在时间标尺上移动,好像放像机的磁头一样。用鼠标拖曳它在时间标尺上移动,当它移到某一时间单位处时,相应的动画用鼠标拖曳它在时间标尺上移动,当它移到某一时间单位处时,相应的动画画面就会出现在网页窗口内。画面就会出现在网页窗口内。(3)【播放】按钮:单击它,可以使动画前进一个帧。按住该按钮不放,可)【播放】按钮:单击它,可以使动画前进一个帧。按住该按钮不放,可以向正常方向播放动画。以向正常方向播放动画。(4)【回放】按钮:单击它,可以使动画回退一帧。单击按下该按钮不放,)【回放】按钮:单击它,可以使动画回退一帧。单击按下该按钮不放,可以向相反方向播放动画。可以向相反方向播放动画。(5)【归位】按钮
5、:将动画图像移到起始位置,同时回放头也移动到该位置)【归位】按钮:将动画图像移到起始位置,同时回放头也移动到该位置处。处。(6)“回放头位置回放头位置”(也是当前帧号码)文本框:用来输入显示和设置(也是当前帧号码)文本框:用来输入显示和设置“回回放头放头”所处的时间轴位置号,即当前帧号码。所处的时间轴位置号,即当前帧号码。(7)“速率速率”文本框:用来输入每秒钟播放的帧数。文本框:用来输入每秒钟播放的帧数。(8)“自动播放自动播放”复选框:选中它后,则在网上下载后会自动播放。不选中复选框:选中它后,则在网上下载后会自动播放。不选中它时,需要在使用行为事件时才可以播放。它时,需要在使用行为事件时
6、才可以播放。(9)“循环循环”复选框:选中它后,则循环播放动画,否则只播放一次动画。复选框:选中它后,则循环播放动画,否则只播放一次动画。(10)动画通道:它由许多图层组成,表示可以在一个页面内加入多个时间)动画通道:它由许多图层组成,表示可以在一个页面内加入多个时间轴动画,但最多可以加轴动画,但最多可以加32个。它的左边标有图层的编号,图层编号大的动画个。它的左边标有图层的编号,图层编号大的动画在图层编号小的动画之上。在图层编号小的动画之上。(11)动画条:表示一个动画所占的帧数,上面标有该动画所在层的名字。)动画条:表示一个动画所占的帧数,上面标有该动画所在层的名字。它的起始处和终止处各有
7、一个小圆,表示首帧和终止帧。如果设置了关键帧,它的起始处和终止处各有一个小圆,表示首帧和终止帧。如果设置了关键帧,则关键帧也会有一个小圆。则关键帧也会有一个小圆。(12)行为通道左边标有字母)行为通道左边标有字母“B”,可以在该通道的特定帧使用行为。,可以在该通道的特定帧使用行为。(13)行为帧:加入了行为的帧,它在)行为帧:加入了行为的帧,它在“行为通道行为通道”内。内。(14)时间标尺:给出了与时间对应的帧数码。)时间标尺:给出了与时间对应的帧数码。2直线移动动画的制作直线移动动画的制作下面来使用下面来使用“时间轴时间轴”面板制作一个简单的、沿直线移动的动画。该动画的面板制作一个简单的、沿
8、直线移动的动画。该动画的制作方法如下所述。制作方法如下所述。(1)在页面内插入一个层,给该层起一个名字,例如)在页面内插入一个层,给该层起一个名字,例如“Layer1”。然后在层。然后在层内插入一个图像、动画或输入一些文字等。此处层中插入的是内插入一个图像、动画或输入一些文字等。此处层中插入的是GIF动画,如动画,如图图6-1-6所示。所示。(2)将插有图像或文字的层移到动画的起始位置。)将插有图像或文字的层移到动画的起始位置。(3)单击)单击“窗口窗口”“时间轴时间轴”菜单命令,调出菜单命令,调出“时间轴时间轴”面板。面板。(4)用鼠标将层拖曳到)用鼠标将层拖曳到“时间轴时间轴”面板的动画通
9、道内,或单击面板的动画通道内,或单击“修修改改”“时间轴时间轴”“增加对象到时间轴增加对象到时间轴”菜单命令。这时,菜单命令。这时,“时间轴时间轴”面面板的动画通道内会出现一个动画条。如果选中了板的动画通道内会出现一个动画条。如果选中了“循环循环”复选框,则在动画复选框,则在动画通道中,会同时出现一个通道中,会同时出现一个“动作帧动作帧” ” 。(5)单击选中动画条的终止帧。默认的动画帧数是)单击选中动画条的终止帧。默认的动画帧数是15帧,如果要调整动画的帧,如果要调整动画的帧数,可用鼠标拖曳动画条终止帧的小圆。在改变了终止帧的位置之后,帧数,可用鼠标拖曳动画条终止帧的小圆。在改变了终止帧的位
10、置之后,如果此时选中了如果此时选中了“循环循环”复选框,还应用鼠标拖曳行为通道的行为帧到终止复选框,还应用鼠标拖曳行为通道的行为帧到终止帧的下一个位置处。用鼠标向右拖曳第帧的下一个位置处。用鼠标向右拖曳第1515帧小圆到第帧小圆到第3030帧处,如图所示。帧处,如图所示。(6)用鼠标拖曳动画层到目标处。当松开鼠标左键时,会看到一条直线,表)用鼠标拖曳动画层到目标处。当松开鼠标左键时,会看到一条直线,表示图像移动的路径。示图像移动的路径。在选中在选中“循环循环”复选框的情况下,如果先用鼠标拖曳动画层到目标处,再调复选框的情况下,如果先用鼠标拖曳动画层到目标处,再调整整“时间轴时间轴”面板中终止帧
11、的位置,则还需要用鼠标拖曳调整面板中终止帧的位置,则还需要用鼠标拖曳调整“动作帧动作帧”到到终止帧的下一帧位置处。终止帧的下一帧位置处。(7)按住【播放】按钮不放,即可在网页设计窗口内看到动画。)按住【播放】按钮不放,即可在网页设计窗口内看到动画。 6.2 6.2 【案例【案例3434】添加游动广告的】添加游动广告的“体育世界体育世界”网页网页“时间轴时间轴”面板可以在用户给出起始帧和终止帧后自动产生中间过程的各帧。面板可以在用户给出起始帧和终止帧后自动产生中间过程的各帧。如果动画的移动路径不是直线的,中间有转折点,则转折点处的画面就是关如果动画的移动路径不是直线的,中间有转折点,则转折点处的
12、画面就是关键帧。加入关键帧,可以使沿直线路径移动的动画变为沿曲线或折线路径移键帧。加入关键帧,可以使沿直线路径移动的动画变为沿曲线或折线路径移动的动画,添加关键帧的方法如下。动的动画,添加关键帧的方法如下。(1)单击选中动画条内要加入关键帧的位置,回放头会随之移到此时间位置,)单击选中动画条内要加入关键帧的位置,回放头会随之移到此时间位置,同时回放头回移到此处,用来指示选中的位置。例如,选择第同时回放头回移到此处,用来指示选中的位置。例如,选择第15帧(将终止帧(将终止帧移到第帧移到第30帧处)。帧处)。(2)在动画条内,单击鼠标右键,调出时间轴快捷菜单。再单击该菜单内的)在动画条内,单击鼠标
13、右键,调出时间轴快捷菜单。再单击该菜单内的“增加关键帧增加关键帧”菜单命令,即可在选中的位置处插入一个关键帧,如图所示。菜单命令,即可在选中的位置处插入一个关键帧,如图所示。按住【按住【Ctrl】键,单击要加入关键帧的位置,也可以添加关键帧。】键,单击要加入关键帧的位置,也可以添加关键帧。如果对关键帧的位置不满意,可以用鼠标拖曳关键帧上的小圆到满意的位置。如果对关键帧的位置不满意,可以用鼠标拖曳关键帧上的小圆到满意的位置。如果要删除关键帧,可以单击选中要删除的关键帧,单击鼠标右键,调出时如果要删除关键帧,可以单击选中要删除的关键帧,单击鼠标右键,调出时间轴快捷菜单,再单击该菜单中的间轴快捷菜单
14、,再单击该菜单中的“移除关键帧移除关键帧”菜单命令即可。菜单命令即可。2制作沿曲线路径移动的动画制作沿曲线路径移动的动画方法方法1:单击选中关键帧,用鼠标拖曳动画层到新的位置,即可确定关键帧图:单击选中关键帧,用鼠标拖曳动画层到新的位置,即可确定关键帧图像的位置。此时,动画移动的路径线会变为一条曲线。可以看出,路径线的像的位置。此时,动画移动的路径线会变为一条曲线。可以看出,路径线的起始位置与终止位置不变。如果要改变关键帧图像的位置,可以再用鼠标拖起始位置与终止位置不变。如果要改变关键帧图像的位置,可以再用鼠标拖曳动画层到新的位置。曳动画层到新的位置。按住【播放】按钮不放,即可在网页设计窗口内
15、看到沿曲线路径移动的动画按住【播放】按钮不放,即可在网页设计窗口内看到沿曲线路径移动的动画了。了。方法方法2:可以用鼠标拖曳的方法来制作沿曲线路径移动的动画,设计过程如下。:可以用鼠标拖曳的方法来制作沿曲线路径移动的动画,设计过程如下。在页面内插入一个层,并给该层起一个名字。然后,在层内插入一个图像或在页面内插入一个层,并给该层起一个名字。然后,在层内插入一个图像或输入一些文字等,再将插有图像或文字的层移到动画的起始位置。此处,层输入一些文字等,再将插有图像或文字的层移到动画的起始位置。此处,层中插入的是图像。中插入的是图像。单击选中该层,再单击单击选中该层,再单击“修改修改”“时间轴时间轴”
16、“录制层路径录制层路径”菜单命令,菜单命令,或者单击时间轴快捷菜单中的或者单击时间轴快捷菜单中的“录制层路径录制层路径”菜单命令。菜单命令。在网页设计窗口内,在网页设计窗口内,按照希望的曲线路径,用鼠标拖曳层。随着鼠标拖曳的按照希望的曲线路径,用鼠标拖曳层。随着鼠标拖曳的进行,会产生一条曲线路径线。进行,会产生一条曲线路径线。松开鼠标左键,即可生成复杂曲线路径。此时,松开鼠标左键,即可生成复杂曲线路径。此时,“时间轴时间轴”面板会自动产生面板会自动产生动画条,如图所示。由产生的动画条可以看出,用鼠标拖曳所用的时间越长,动画条,如图所示。由产生的动画条可以看出,用鼠标拖曳所用的时间越长,组成动画
17、的帧数也越多。鼠标拖曳时的转折点越多,自动产生的关键帧也越组成动画的帧数也越多。鼠标拖曳时的转折点越多,自动产生的关键帧也越多。多。按住【播放】按钮不放,即可在网页设计窗口内看到沿曲线路径移动的动画按住【播放】按钮不放,即可在网页设计窗口内看到沿曲线路径移动的动画3动画的更名、删除、复制和移动动画的更名、删除、复制和移动(1)动画的更名:动画的更名:可以直接在可以直接在“时间轴时间轴”面板的列表框内更改动画的名字。面板的列表框内更改动画的名字。另外,可以单击时间轴菜单中的另外,可以单击时间轴菜单中的“重命名时间轴重命名时间轴”菜单命令,调出菜单命令,调出“重命名重命名时间时间轴轴”对话框。在该
18、对话框的对话框。在该对话框的“时间轴名称时间轴名称”文本框内输入新的名字,再单击文本框内输入新的名字,再单击【确定】按钮即可。【确定】按钮即可。(2)动画的删除:动画的删除方法如下。)动画的删除:动画的删除方法如下。删除动画条:单击选中要删除的动画条,按【删除动画条:单击选中要删除的动画条,按【Delete】键或单击】键或单击“编编辑辑”“剪切剪切”菜单命令。菜单命令。删除所有动画条:单击时间轴菜单中的删除所有动画条:单击时间轴菜单中的“移除时间轴移除时间轴”菜单命令。菜单命令。(3)动画的复制:动画的复制方法如下。)动画的复制:动画的复制方法如下。单击选中要复制的动画条,再单击时间轴菜单中的
19、单击选中要复制的动画条,再单击时间轴菜单中的“拷贝拷贝”菜单命令。菜单命令。调整回放头的位置,再单击时间轴菜单中的调整回放头的位置,再单击时间轴菜单中的“粘贴粘贴”菜单命令,即可在选中菜单命令,即可在选中的动画条的右边复制一个动画条。而且可以粘贴到其他页面的的动画条的右边复制一个动画条。而且可以粘贴到其他页面的“时间轴时间轴”面面板中。板中。(4)动画的移动:动画的移动方法如下。)动画的移动:动画的移动方法如下。方法一:单击选中要移动的动画条,再单击时间轴菜单中的方法一:单击选中要移动的动画条,再单击时间轴菜单中的“剪切剪切”菜单命菜单命令。调整回放头的位置,再单击时间轴菜单中的令。调整回放头
20、的位置,再单击时间轴菜单中的“粘贴粘贴”菜单命令,即可将菜单命令,即可将动画条移到回放头所处的位置处,而且可以移动到其他页面的动画条移到回放头所处的位置处,而且可以移动到其他页面的“时间轴时间轴”面面板中。板中。方法二:方法二:可以用鼠标拖曳一个动画条在整个动画通道内移动。按住【可以用鼠标拖曳一个动画条在整个动画通道内移动。按住【ShiftShift】键,单击要移动的动画条,选中多个动画条,鼠标拖曳选中的动画条,即可键,单击要移动的动画条,选中多个动画条,鼠标拖曳选中的动画条,即可同时移动多个动画条。同时移动多个动画条。 6.3 6.3 【案例【案例3535】“跟我学计算机跟我学计算机”网页网
21、页调出式菜调出式菜单单1动作名称及其作用动作名称及其作用行为是动作(行为是动作(Actions)和事件()和事件(Events)的组合。动作就是计算机系统执行)的组合。动作就是计算机系统执行的一个动作,例如,调出一个提示框、执行一段程序或一个函数、播放声音的一个动作,例如,调出一个提示框、执行一段程序或一个函数、播放声音或影片、启动或停止或影片、启动或停止“时间轴时间轴”面板中的动画等。动作通常是由预先编写好面板中的动画等。动作通常是由预先编写好的的JavaScript程序脚本实现的,程序脚本实现的,Dreamweaver 8自带了一些动作的自带了一些动作的JavaScript程序脚本,可供用
22、户直接调用。用户也可以自己用程序脚本,可供用户直接调用。用户也可以自己用JavaScript语言编写语言编写JavaScript程序脚本,创建新的行为。程序脚本,创建新的行为。事件是指引发动作产生的事情,例如,鼠标移到某对象之上、鼠标单击某对事件是指引发动作产生的事情,例如,鼠标移到某对象之上、鼠标单击某对象、象、“时间轴时间轴”面板中的回放头播放到某一帧等。要创建一个行为,就是要面板中的回放头播放到某一帧等。要创建一个行为,就是要指定一个动作,再确定触发该动作的事件。有时,某几个动作可以被相同的指定一个动作,再确定触发该动作的事件。有时,某几个动作可以被相同的事件触发,则须要指定动作发生的顺
23、序。事件触发,则须要指定动作发生的顺序。Dreamweaver 8采用了采用了“行为行为”面板(也叫面板(也叫“行为控制器行为控制器”)来完成行为中的)来完成行为中的动作和事件的设置,从而实现动态交互效果。动作和事件的设置,从而实现动态交互效果。单击单击“窗口窗口”“行为行为”菜单命令或按【菜单命令或按【Shift+F3】组合键,即可调出】组合键,即可调出“行为行为”面板。面板。单击单击“行为行为”面板中的面板中的“添加行为添加行为 ” ”按钮,调出按钮,调出“动作名称动作名称”菜单,其菜单,其作用如作用如表所示表所示 。再单击某。再单击某 一个动作名称,即可进行相应的动作设置。一个动作名称,
24、即可进行相应的动作设置。动作名称及动作的作用动作名称及动作的作用 序号 动作的英文名称 动作的中文名称 动作的作用 1Swap Image 交换图像 交换图像 2Popup Message 调出信息 调出消息栏 3Swap Image Restore 恢复交换图像 恢复交换图像 4Open Browser Window 打开浏览器窗口 打开新的浏览器窗口 5Drag Layer 拖动层 拖曳层到目标位置 6Control Shockwave or Flash 控制Shockwave 或Flash 控制Shockwave 或Flash影像 7Play Sound 播放声音 播放声音 8Chang
25、e Property 改变属性 改变对象的属性 9-1Play Timeline 时间轴(播放时间轴) 播放时间轴上的动画 9-2Stop Timeline 时间轴(停止时间轴) 停止时间轴上动画的播放 9-3Go To Timeline Frame 时间轴(转到时间轴帧) 跳转到时间轴上的某一帧 10Show-Hide Layers 显示隐藏层 显示或隐藏层 11Show-Menu 显示调出菜单 为图像添加调出菜单 序号 动作的英文名称 动作的中文名称 动作的作用 12Check Plugin 检查插件 检查浏览器中已安装插件的功能 13Check Browser 检查浏览器 检查浏览器的类
26、型和型号,以确定显示的页面 14Validate Form 检查表单 检查指定的表单内容的数据类型是否正确 15Set Nav Bar Image 设置导航栏图像 设置引导链接的动态导航条图像按钮 16-1Set Text of Layer 设置文本(设置层文本) 设置层中的文本 16-2Set Text of Frame 设置文本(设置框架文本) 设置框架中的文本 16-3Set Text of Text Field 设置文本(设置文本域文字) 设置表单域内文字框中的文字 16-4Set Text of Status Bar 设置文本(设置状态条文本) 设置状态栏中的文本 17Call Ja
27、vaScript 调用JavaScript 调用JavaScript函数 18Jump Menu 跳转菜单 选择菜单实现跳转 19Jump Menu Go 跳转菜单开始 选择菜单后,单击【Go】按钮实现跳转 20Go To URL 转到URL 跳转到URL指定的网页 21Preload Images 预先载入图像预装载图像,以改善显示效果 22Get More Behaviors 获得更多行为 上网,获得更多行为(不属于动作) 注意:注意:对于选择不同的浏览器,可以使用的动作也不一样,版本低的浏览器可以使用对于选择不同的浏览器,可以使用的动作也不一样,版本低的浏览器可以使用的动作较少。当选定的
28、对象不一样时,动作名称菜单中可以使用的动作也不一样。的动作较少。当选定的对象不一样时,动作名称菜单中可以使用的动作也不一样。进行完动作的设置后,在进行完动作的设置后,在“行为行为”面板的列表框内会显示出动作的名称与默面板的列表框内会显示出动作的名称与默认的事件名认的事件名称。可以看出,在选中动作名称后,称。可以看出,在选中动作名称后,“事件事件”栏中默认的事件名栏中默认的事件名称右边会出现一个按钮。称右边会出现一个按钮。2 2事件名称及其作用事件名称及其作用如果要重新设置事件,可单击如果要重新设置事件,可单击“事件事件”栏中默认的事件名称右边的按钮,调栏中默认的事件名称右边的按钮,调出事件名称
29、菜单。菜单中列出了该对象可以使用的所有事件。出事件名称菜单。菜单中列出了该对象可以使用的所有事件。各个事件的名称及其作用如表所示。各个事件的名称及其作用如表所示。序号 事 件 名 称 事件可以作用的对象 事件的作用 1OnAbort 图像、页面等 中断对象载入操作时 2onAfterUpdate 图像、页面等 对象更新之后 3onBeforeUpdate 图像、页面等 对象更新之前 4onFocus 按钮、链接和文本框等 当前对象得到输入焦点时 5onBlur 按钮、链接和文本框等 焦点从当前对象移开时 序号 事 件 名 称 事件可以作用的对象 事件的作用 6onClick 所有对象 单击对象
30、时 7onDblClick 所有对象 双击对象时 8onError 图像、页面等 载入图像等当中产生错误时 9onHelp 图像等 调用帮助时 10onLoad 图像、页面等 载入对象时 11onMouseDown 链接图像和文字等 在链接文字或图像处按下鼠标左键时 12onMouseUp 链接图像和文字等 在链接文字或图像处松开鼠标左键时 13onMouseOver 链接图像和文字等 鼠标指针移入链接文字或图像区域时 14onMouseOut 链接图像和文字等 鼠标指针移出链接文字或图像区域时 15onMouseMove 链接图像和文字等 鼠标指针在链接文字或图像上移动时 16onReady
31、StateChange 图像等 对象状态改变时 17onKeyDown 链接图像和文字等 当焦点在对象上,按键处于按下状态时 序号 事 件 名 称 事件可以作用的对象 事件的作用 18onKeyPress 链接图像和文字等 当焦点在对象上,按键按下时 19onKeyUp 链接图像和文字等 当焦点在对象上,按键抬起时 20onSubmit 表单等 表单提交时 21onReset 表单等 表单重置时 22onSelect 文字段落、选择框等 选定文字段落或选择框内某项时 23onUnload 主页面等 当离开此页时 24onResize 主窗口、帧窗口等 当浏览器内的窗口大小改变时 25onScr
32、oll主窗口、帧窗口、多行输入文本框等 当拖曳浏览器窗口的滚动条时 26onRowEnter Shockwave等 动画载入时 27OnRowExit Shockwave等 动画卸载时 注意:注意:如果出现带括号的事件,则该事件是链接对象的。使用它们时,系统会自动在如果出现带括号的事件,则该事件是链接对象的。使用它们时,系统会自动在行为控制器下拉列表框内显示的事件名称前面增加一个行为控制器下拉列表框内显示的事件名称前面增加一个“#”号,表示空链接。号,表示空链接。3设置行为的其他操作设置行为的其他操作(1)选择行为的目标对象:要设置行为,必须先选中事件作用的对象。单击)选择行为的目标对象:要设
33、置行为,必须先选中事件作用的对象。单击选中图像、用鼠标拖曳选中文字等,都可以选择行为的目标对象。另外,也选中图像、用鼠标拖曳选中文字等,都可以选择行为的目标对象。另外,也可以单击网页设计窗口左下角状态栏上的标记,来选中行为的目标对象。例可以单击网页设计窗口左下角状态栏上的标记,来选中行为的目标对象。例如,要选中整个页面窗口,可单击如,要选中整个页面窗口,可单击 标记。还可以单击页面空白处,再标记。还可以单击页面空白处,再按【按【Ctrl+A】组合键。】组合键。选中不同的对象后,选中不同的对象后,“标签标签”面板的标题栏名称会随之发生变化。面板的标题栏名称会随之发生变化。“标签标签”面板的标题栏
34、的名称中将显示行为的对象名称,例如,选择整个页面窗口后,面板的标题栏的名称中将显示行为的对象名称,例如,选择整个页面窗口后,“标签标签”面板的名称为面板的名称为“标签标签”。(2)显示所有事件:显示所有事件:单击单击“行为行为”面板中的【显示所有事件】按钮面板中的【显示所有事件】按钮 ,在,在“行为行为”面板中会显示出选中对象所能使用的所有事件。单击【显示设置事面板中会显示出选中对象所能使用的所有事件。单击【显示设置事件】按钮件】按钮 后,在后,在“行为行为”面板中只显示已经使用的事件。面板中只显示已经使用的事件。(3)单击选中)单击选中“行为行为”面板内的某一个行为项(即动作和事件)时,再单
35、击面板内的某一个行为项(即动作和事件)时,再单击按钮按钮 ,即可删除选中的行为项。,即可删除选中的行为项。(4)单击选中)单击选中“行为行为”面板内的某一个行为项后,再单击面板内的某一个行为项后,再单击 按钮,可以使按钮,可以使选中的行为的执行次序提前,单击选中行为项后,再单击选中的行为的执行次序提前,单击选中行为项后,再单击 按钮,可以使按钮,可以使选中的行为,执行次序下降。选中的行为,执行次序下降。4“显示显示隐藏层隐藏层”动作动作选中层以后,在选中层以后,在“行为行为”面板中选择面板中选择“显示显示隐藏层隐藏层”菜单命令,可以调出菜单命令,可以调出“显示显示隐藏层隐藏层”对话框。对话框。
36、(1)如果要设置层为显示状态,则单击选中)如果要设置层为显示状态,则单击选中“命名的层命名的层”列表框内层的名称,列表框内层的名称,再单击【显示】按钮,此时再单击【显示】按钮,此时“命名的层命名的层”列表框内选中的层名称右边会出现列表框内选中的层名称右边会出现“(显示)(显示)”文字。文字。(2)如果要设置层为不显示状态,则单击选中)如果要设置层为不显示状态,则单击选中“命名的层命名的层”列表框内层的名列表框内层的名称,再单击【隐藏】按钮,此时称,再单击【隐藏】按钮,此时“命名的层命名的层”列表框内选中的层名称右边会列表框内选中的层名称右边会出现出现“(隐藏)(隐藏)”文字。文字。(3)单击【
37、默认值】按钮后,可将层的显示与否设置为默认状态。)单击【默认值】按钮后,可将层的显示与否设置为默认状态。 6.4 6.4 【案例【案例3636】“北京名胜北京名胜1 1”网页网页交替变化图交替变化图像像 1“调出信息调出信息”动作动作选择整个页面,单击选择整个页面,单击“行为行为”面板中的面板中的 按钮,调出按钮,调出“动作名称动作名称”菜单,单菜单,单击选择击选择“调出信息调出信息”菜单命令,调出菜单命令,调出“调出信息调出信息”对话框。在对话框。在“消息消息”文本文本框内输入调出的对话框内要显示的文字,单击【确定】按钮,即可完成动作框内输入调出的对话框内要显示的文字,单击【确定】按钮,即可
38、完成动作设置。设置。2“设置文本设置文本”动作动作选择一个页面对象,单击选择一个页面对象,单击“行为行为”面板中的面板中的 按钮,调出按钮,调出“动作名称动作名称”菜单,菜单,单击选择单击选择“设置文本设置文本”菜单命令,调出它的子菜单,各子菜单命令的作用如菜单命令,调出它的子菜单,各子菜单命令的作用如下所述。下所述。(1)设置状态条文本:选择整个页面,单击)设置状态条文本:选择整个页面,单击“行为行为”面板中的面板中的 按钮,再按钮,再单击选择单击选择“设置文本设置文本”“设置状态栏文本设置状态栏文本”菜单命令,会调出菜单命令,会调出“设置状态设置状态栏文本栏文本”对话框。在对话框。在“消息
39、消息”文本框内输入要在状态栏中显示的文字,然后文本框内输入要在状态栏中显示的文字,然后单击【确定】按钮。单击【确定】按钮。(2)设置层文本:选择一个层,单击)设置层文本:选择一个层,单击“行为行为”面板中的面板中的 按钮,单击选择按钮,单击选择“设置文本设置文本”“设置状态栏文本设置状态栏文本”菜单命令,调出菜单命令,调出“设置层文本设置层文本”对话框。对话框。利用该对话框,可以在指定的层中建立一个文本域。该对话框中各选项的作利用该对话框,可以在指定的层中建立一个文本域。该对话框中各选项的作用如下。用如下。“层层”下拉列表框:下拉列表框:选择层的名称。选择层的名称。“新建新建HTMLHTML”
40、文本框:可以输入发生事件后,在选定层内显示的文字内容,该文本框:可以输入发生事件后,在选定层内显示的文字内容,该内容包括任何有效的内容包括任何有效的HTMLHTML源代码。源代码。(3 3)设置框架文本:在创建框架后,选中一个框架,单击)设置框架文本:在创建框架后,选中一个框架,单击“行为行为”面板中的面板中的按钮按钮 ,再单击选择,再单击选择“设置文本设置文本”“设置框架文本设置框架文本”菜单命令,调出菜单命令,调出“设置框架文本设置框架文本”对话框。利用该对话框,可以在选中的框架内建立一个文对话框。利用该对话框,可以在选中的框架内建立一个文本域。该对话框中各选项的作用如下。本域。该对话框中
41、各选项的作用如下。 “框架框架”下拉列表框:用来选择分栏框架窗口的名称。下拉列表框:用来选择分栏框架窗口的名称。“新建新建HTML”文本框:可以在此文本框内输入发生事件后,在选定的分栏文本框:可以在此文本框内输入发生事件后,在选定的分栏框架窗口内显示的文字内容,该内容包括任何有效的框架窗口内显示的文字内容,该内容包括任何有效的HTML源代码。源代码。【获得当前【获得当前HTML】按钮:单击它后,在】按钮:单击它后,在“新建新建 HTML”文本框内会显示出文本框内会显示出选中的分栏框架窗口内网页的选中的分栏框架窗口内网页的HTML地址。地址。“保留背景颜色保留背景颜色”复选框:选择它后,可以保存
42、背景色。复选框:选择它后,可以保存背景色。(4)设置文本域文字:先创建表单域内的文本框,并命名,单击)设置文本域文字:先创建表单域内的文本框,并命名,单击“行为行为”面面板中的板中的 按钮,再单击选择按钮,再单击选择“设置文本设置文本”“设置文本域文字设置文本域文字”菜单命令,菜单命令,调出调出“设置文本域文字设置文本域文字”对话框,如图所示。对话框,如图所示。 在该对话框的在该对话框的“文本域文本域”下拉列表框内选择文本域,再在下拉列表框内选择文本域,再在“新建文本新建文本”文本文本框内输入文本。然后,单击【确定】按钮,退出框内输入文本。然后,单击【确定】按钮,退出“设置文本域文字设置文本域
43、文字”对话框。对话框。 6.5 6.5 【案例【案例3737】“北京名胜北京名胜2 2”网页网页弹出窗口弹出窗口 1“打开浏览器窗口打开浏览器窗口”动作动作单击单击“行为行为”面板中的按钮,调出面板中的按钮,调出“动作名称动作名称”菜单,单击选择菜单,单击选择“打开浏览打开浏览器窗口器窗口”菜单命令,调出菜单命令,调出“打开浏览器窗口打开浏览器窗口”对话框。对话框。(1)“要显示的要显示的URL”文本框与【浏览】按钮:在文本框内输入新打开的浏文本框与【浏览】按钮:在文本框内输入新打开的浏览器窗口内要显示的网页文件地址或单击【浏览】按钮后,选择网页文件。览器窗口内要显示的网页文件地址或单击【浏览
44、】按钮后,选择网页文件。(2)“窗口宽度窗口宽度”与与“窗口高度窗口高度”文本框:设定浏览器窗口的宽度和高度。文本框:设定浏览器窗口的宽度和高度。(3)“属性属性”栏:用来定义浏览器窗口的属性。栏:用来定义浏览器窗口的属性。选中选中“导航工具栏导航工具栏”复选框,表示保留浏览器的导航工具栏。复选框,表示保留浏览器的导航工具栏。选中选中“菜单栏菜单栏”复选框,表示保留浏览器的主菜单。复选框,表示保留浏览器的主菜单。选中选中“地址工具栏地址工具栏”复选框,表示保留浏览器的地址栏。复选框,表示保留浏览器的地址栏。选中选中“需要时使用滚动条需要时使用滚动条”复选框,表示根据需要给浏览器的显示窗口加滚复
45、选框,表示根据需要给浏览器的显示窗口加滚动条。动条。选中选中“状态栏状态栏”复选框,表示给浏览器的显示窗口下边加状态栏。复选框,表示给浏览器的显示窗口下边加状态栏。选中选中“调整大小手柄调整大小手柄”复选框,表示可以用鼠标拖曳调整浏览器显示窗口的复选框,表示可以用鼠标拖曳调整浏览器显示窗口的大小。大小。(4)“窗口名称窗口名称”文本框:输入新的浏览器窗口的名称。文本框:输入新的浏览器窗口的名称。2“改变属性改变属性”动作动作单击单击“行为行为”面板中的面板中的 按钮,调出按钮,调出“动作名称动作名称”菜单,单击选择菜单,单击选择“改变属改变属性性”菜单命令,调出菜单命令,调出“改变属性改变属性
46、”对话框。对话框。(1)“对象类型对象类型”下拉列表框:用来选择对象在下拉列表框:用来选择对象在HTML文件中所用的标记。文件中所用的标记。例如,可选择例如,可选择标记。标记。(2)“命名对象命名对象”下拉列表框:用来选择对象的名字。对象的名字是在它的下拉列表框:用来选择对象的名字。对象的名字是在它的“属性属性”栏内输入的。栏内输入的。(3)“属性属性”栏:在选择了栏:在选择了“选择选择”单选按钮后,可以选择要改变对象的属单选按钮后,可以选择要改变对象的属性名字,即它的标识符属性名称。在选择了性名字,即它的标识符属性名称。在选择了“输入输入”单选按钮后,可在其右单选按钮后,可在其右边的文本框内
47、输入属性边的文本框内输入属性名字。例如,在名字。例如,在“对象类型对象类型”下拉列表框内选择了下拉列表框内选择了 dir标记,则标记,则“选择选择”下拉列表框内显示的内容如图所示。下拉列表框内显示的内容如图所示。“属性属性”栏右边栏右边的下拉列表框用来选择浏览器。的下拉列表框用来选择浏览器。在图所示的下拉列表框内给出了各种样式的名称。如果选择了在图所示的下拉列表框内给出了各种样式的名称。如果选择了“innerHTML”选项,则可以对选项,则可以对HTML语言的内容进行替换;如果选择了语言的内容进行替换;如果选择了“innerText”选项,选项,则可以对文则可以对文本内容进行替换。本内容进行替
48、换。(4)“新的值新的值”文本框:用于输入属性的新值。文本框:用于输入属性的新值。 6.6 6.6 【案例【案例3838】“图像链接翻转图像链接翻转”网页网页 1“设置导航栏图像设置导航栏图像”动作动作在页面中插入导航栏或图像,单击在页面中插入导航栏或图像,单击“行为行为”面板中按钮的右下角箭头,调出面板中按钮的右下角箭头,调出“动作名称动作名称”菜单。单击选择菜单。单击选择“设置导航栏图像设置导航栏图像”菜单命令,调出菜单命令,调出“设置导设置导航栏图像航栏图像”对话框。对话框。(1)选择)选择“基本基本”标签后的标签后的“设置导航栏图像设置导航栏图像”对话框,其中各选项的作用对话框,其中各
49、选项的作用如下。如下。“项目名称项目名称”文本框:输入此动态图像按钮的名称。文本框:输入此动态图像按钮的名称。4个文本框与【浏览】按钮:定义鼠标个文本框与【浏览】按钮:定义鼠标4种状态时的图像。种状态时的图像。“状态图像状态图像”是正是正常状态(静态)下的图像,常状态(静态)下的图像,“鼠标经过图像鼠标经过图像”是鼠标移到图像之上时的图像,是鼠标移到图像之上时的图像,“按下图像按下图像”是鼠标单击图像时的图像,是鼠标单击图像时的图像,“按下时鼠标经过图像按下时鼠标经过图像”是鼠标按是鼠标按下并拖曳鼠标指针经过图像的过程中的图像。下并拖曳鼠标指针经过图像的过程中的图像。 “按下时,前往的按下时,
50、前往的URL”栏:在文本框内可输入与导航图像链接的页面文件栏:在文本框内可输入与导航图像链接的页面文件的目录和文件名,单击【浏览】按钮后可选择链接的文件,其右边的下拉列的目录和文件名,单击【浏览】按钮后可选择链接的文件,其右边的下拉列表框内可选择显示链接的页面的打开方式。表框内可选择显示链接的页面的打开方式。“选项选项”栏:栏:“预先载入图像预先载入图像”复选框用来确定是否要预先载入各个图像,复选框用来确定是否要预先载入各个图像,“最初显示最初显示按下图像按下图像”复选框用来确定是否要在初始状态下显示复选框用来确定是否要在初始状态下显示“按下按下图像图像”状态时的图像。状态时的图像。(2)单击