第八章在网页中使用行为..ppt

第8章在网页中使用行为,$知识目标了解Dreamweaver8中的行为；掌握Dreamweaver8内置行为的添加方法；掌握行为的设置流程，及应用方法。8能力目标掌握行为面板的使用；熟练内置行为的添加与应用操作。,第一节认识行为第二节使用Dreamwerver8内置的行为本章小结,第一节认识行为,一、认识行为二、使用行为面板三、增加行为的基本步骤四、修改行为,行为是由对象、事件和动作构成的。1对象：是产生行为的主体。网页中的很多元素都可以成为对象，如网页中的一个图片、一段文字等元素，也可以整个网页文档。2事件：是由用户或浏览器触发的事件。事件经常是针对页面元素的，如鼠标经过、鼠标单击、键盘某个键按下等。3动作：通常是一段JavaScript代码，用于完成某些特殊的任务。如打开一个窗口时自动播放声音、弹出信息窗口等。4行为：事件和动作组合起来就构成了行为。事件是产生行为的条件，动作是行为的具体结果。,一、认识行为,单击菜单栏中的“窗口”|“行为”命令或使用组合键Shift+F4，可以打开行为面板如图1所示。（一）行为面板各按钮功能（二）设置浏览器版本在行为面板中，单击按钮，在“显示事件”的级联菜单中选择浏览器版本，如图2所示。,二、使用行为面板,图1,图2,（三）常见事件添加行为后，要为行为选择触发事件。选择某个行为，单击左侧的事件名称右侧的下拉箭头弹出下拉菜单，菜单列出了所选行为可以使用的触发事件，如图所示。,1在文档窗口中选择要增加行为的对象，例如一个图像或一个链接或一段文字。要将行为附加到整个页，请在“文档”窗口底部左侧的标签选择器中单击标签。2在行为面板中单击加号“+”按钮，从弹出菜单中选择一种行为。3打开某种行为的设置对话框，根据需要进行设置，完成对话框。4在行为面板中选择行为，添加触发事件。5保存网页，在浏览器中检测行为。,三、增加行为的基本步骤,四、修改行为,要修改和编辑己设置行为,执行以下操作之一：1在行为面板中双击要修改的行为。2选择要修改的行，单击行为面板上的“选项”按钮，选择“编辑行为”命令。,第二节使用Dreamwerver8内置的行为,一、播放声音二、打开浏览器窗口三、弹出消息四、转到URL五、设置状态栏文本六、拖动层七、检查浏览器八、改变对象属性九、控制Shockwave或Flash,1打开一个网页，选择行为的对象如某一图像，也可单击窗口下方的标签，为整个页面增加行为。2在行为面板上，单击“+”按钮，从下拉菜单中选择“播放声音”。3打开“播放声音”对话框。4在文本框中输入声音文件的路径和名称，也可单击“浏览”按钮，选择要播放的声音文件。5单击“确定”按钮。在网页中出现占位符。6在行为面板设置事件，如设为“OnLoad”。7保存并在浏览器中预览网页，观看效果。,一、播放声音,1打开一个网页，选择行为的对象如某一图像，如选择一个图像。2在行为面板上，单击“+”按钮，从下拉菜单中选择“打开浏览器窗口”。3打开“打开浏览器窗口”对话框，如图所示。4设置对话框，单击“确定”按钮。5.在行为面板设置事件，如设为“OnMouseOver”6保存并在浏览器中测试行为。,二、打开浏览器窗口,1打开一个网页，选择行为的对象，如选择一个图像。2在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“弹出消息”。3打开“弹出消息”对话框，如图所示。4输入要显示的信息，单击“确定”按钮。5在行为面板设置事件，如设为“OnMouseDown”6保存并在浏览器中测试行为。,三、弹出消息,1打开一个网页，插入一个按钮，在“属性检查器”中设置“动作”为“无”。2选中按钮。在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“转到URL”。3打开“转到URL”对话框，如图所示。4在“URL”框中输入要打开的文件的路径和名称，也可单击“浏览”按钮选择文件。5单击“确定”按钮。6在行为面板设置事件，如设为“OnMouseDown”7保存并在浏览器中测试行为,四、转到URL,1打开一个网页，选择窗口下方的标签。2在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“设置文本”子菜单中的“设置状态栏文本”。3打开“设置状态栏文本”对话框，如图所示。4输入要显示的信息，单击“确定”按钮。5在行为面板设置事件，如设为“OnLoad”。6保存并在浏览器中测试行为。,五、设置状态栏文本,1打开一个网页，插入一个层，命名为layer1，在层插入图像。2选择窗口下方的标签。3在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“拖动层”。4打开“拖动层”对话框，如图所示。5在“基本”选项中，选择要拖动的层，其他使用默认设置。6单击“确定”按钮，退出“拖动层”对话框。7在行为面板设置事件为“OnLoad”。8保存并在浏览器中测试行为。,六、拖动层,1打开一个网页，选择窗口下方的标签。2在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“检查浏览器”。3打开“检查浏览器”对话框，如图所示。,七、检查浏览器,4对话框各项设置如下：“NetscapeNavigator”：用于设置NetscapeNavigator浏览器的版本及打开的网页。“InternetExplorer“：用于设置InternetExplorer浏览器的版本及打开的网页。“其他浏览器”：设置对于其他浏览器的选项设置，。“URL”：用于设置要跳转的地址，单击“浏览”按钮可以选择跳转的文件。“替代URL”：用于设置替代的URL，也可以单击“浏览”按钮选择文件。5设置完成后，单击“确定”退出对话框。6在行为面板设置事件为“OnLoad”。7保存并在浏览器中测试行为。,1打开一个网页，插入两个按钮，按钮动作为“无”，绘制一个层，命名为Layer1，设置层的背景颜色为浅紫色，如图1所示。2选中“粉色”按钮。在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“改变属性”。3打开“改变属性”对话框，如图2所示。,八、改变对象属性,4对话框各项设置如下：“对象类型”：选择要改变的类型。选择“LAYER”“命名对象”：从下拉菜单中选择要更改属性的对象名称，选择layer“Layer1”。“属性”：设置要改变的属性名称及浏览器版本。改变背景选择“style.backgroundColor”，浏览器版本选择“IE4”。“新的值”：设置新属性的值。输入“pink”。5单击“确定”，退出对话框。6在行为面板设置事件为“OnMouseDown”。7选中“绿色”按钮，添加“改变属性”，设置“新的值”为“green”，事件为“OnMouseDown”。8保存并在浏览器中测试行为。,1打开一个网页，插入两个按钮，按钮动作为“无”，插入一个Flash，在属性检查器中命名为“flash1”并将“自动播放”和“循环”选项取消，如图1所示。2选中“play”按钮。在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“控制Shockwave或Flash”。3打开“控制Shockwave或Flash”对话框，如图2所示。,九