Dreamweaver中的行为.ppt

1、1 认识行为 2 使用Dreamwerver8内置的行为 3 插入行为脚本,在网页中使用行为,1 认识行为,1.1 认识行为 1.2 使用行为面板 1.3 增加行为的基本步骤 1.4 修改行为,行为是由对象、事件和动作构成的。 1对象：是产生行为的主体。网页中的很多元素都可以成为对象，如网页中的一个图片、一段文字等元素，也可以整个网页文档。 2事件：是由用户或浏览器触发的事件。事件经常是针对页面元素的，如鼠标经过、鼠标单击、键盘某个键按下等。 3动作：通常是一段JavaScript代码，用于完成某些特殊的任务。如打开一个窗口时自动播放声音、弹出信息窗口等。 4行为：事件和动作组合起来就构成了行

2、为。事件是产生行为的条件，动作是行为的具体结果。,1.1 认识行为,1 认识行为,单击菜单栏中的“窗口”|“行为”命令或使用组合键Shift+F4，可以打开行为面板如图所示。 （一）行为面板各按钮功能 （二）设置浏览器版本 在行为面板中，单击 按钮，在“显示事件”的级联菜单中选择浏览器版本，如图所示。,1.2 使用行为面板,1 认识行为,（三）常见事件 添加行为后，要为行为选择触发事件。选择某个行为，单击左侧的事件名称右侧的下拉箭头弹出下拉菜单，菜单列出了所选行为可以使用的触发事件，如图所示。,1.2 使用行为面板,1 认识行为,1在文档窗口中选择要增加行为的对象，例如一个图像或一个链接或一段

3、文字。要将行为附加到整个页，请在“文档”窗口底部左侧的标签选择器中单击 标签。 2在行为面板中单击加号“+”按钮，从弹出菜单中选择一种行为。 3打开某种行为的设置对话框，根据需要进行设置，完成对话框。 4在行为面板中选择行为，添加触发事件。 6保存网页，在浏览器中检测行为。,1.3 增加行为的基本步骤,1 认识行为,要修改和编辑己设置行为,执行以下操作之一： 1在行为面板中双击要修改的行为。 2选择要修改的行，单击行为面板上的“选项”按钮 ，选择“编辑行为”命令。,1.4 修改行为,2 使用Dreamwerver8内置的行为,2.1 播放声音 2.2 打开浏览器窗口 2.3 弹出消息 2.4

4、转到URL 2.5 设置状态栏文本 2.6 拖动层 2.7 显示隐藏层 2.8 改变对象属性,1打开一个网页，选择行为的对象如某一图像，也可单击窗口下方的标签，为整个页面增加行为。 2在行为面板上，单击“+”按钮，从下拉菜单中选择“播放声音”。 3打开“播放声音”对话框。 4在文本框中输入声音文件的路径和名称，也可单击“浏览”按钮，选择要播放的声音文件。 5单击“确定”按钮。在网页中出现占位符。 6在行为面板设置事件，如设为“OnLoad”。 7保存并在浏览器中预览网页，观看效果。,2.1 播放声音,2 使用Dreamwerver8内置的行为,1打开一个网页，选择行为的对象如某一图像，如选择一

5、个图像。 2在行为面板上，单击“+”按钮，从下拉菜单中选择“打开浏览器窗口”。 3打开“打开浏览器窗口”对话框，如图所示。 4设置对话框，单击“确定”按钮。 在行为面板设置事件，如设为“OnMouseOver” 6保存并在浏览器中测试行为。,2.2 打开浏览器窗口,2 使用Dreamwerver8内置的行为,1打开一个网页，选择行为的对象，如选择一个图像。 2在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“弹出消息”。 3打开“弹出消息”对话框，如图所示。 4输入要显示的信息，单击“确定”按钮。 5在行为面板设置事件，如设为“OnMouseDown” 6保存并在浏览器中测试行为。,2.3

6、 弹出消息,2 使用Dreamwerver8内置的行为,1打开一个网页，插入一个按钮，在“属性检查器”中设置“动作”为“无”。 2选中按钮。在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“转到URL”。 3打开“转到URL”对话框，如图所示。 4在“URL”框中输入要打开的文件的路径和名称，也可单击“浏览”按钮选择文件。 5单击“确定”按钮。 6在行为面板设置事件，如设为“OnMouseDown” 7保存并在浏览器中测试行为,2.4 转到URL,2 使用Dreamwerver8内置的行为,1打开一个网页，选择窗口下方的标签。 2在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“设置文

7、本”子菜单中的“设置状态栏文本”。 3打开“设置状态栏文本”对话框，如图所示。 4输入要显示的信息，单击“确定”按钮。 5在行为面板设置事件，如设为“OnLoad”。 6保存并在浏览器中测试行为。,2.5 设置状态栏文本,2 使用Dreamwerver8内置的行为,1打开一个网页，插入一个层，命名为layer1，在层插入图像。 2选择窗口下方的标签。 3在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“拖动层”。 4打开“拖动层”对话框，如图所示。 5在“基本”选项中，选择要拖动的层，其他使用默认设置。 6单击“确定”按钮，退出“拖动层”对话框。 7在行为面板设置事件为“OnLoad”。

8、8保存并在浏览器中测试行为。,2.6 拖动层,2 使用Dreamwerver8内置的行为,1打开一个网页，输入“长影世纪城景观”，并设置空链接。 2插入一个层，命名为“Layer1”，在层中插入图像，如图所示 3选中“长影世纪城景观”，在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“显示隐藏层”。 打开“显示隐藏层”对话框，如图所示。,2.7 显示隐藏层,2 使用Dreamwerver8内置的行为,5在“命名的层”中显示了所有的层，选择“Layer1”。 6单击“隐藏”按钮，然后单击“确定”，退出“显示隐藏层”对话框。 7在行为面板设置事件为“OnMouseOut”。 8重新选择“长影世

9、纪城景观”文本，打开“显示隐藏层”对话框，选择“Layer1”，单击“显示”按钮，确定退出对话框将行为事件设为“OnMouseOver”。行为面板显示如图所示。 10选中网页的层，在属性检查器中设置“可见性”为“hidden”，使层初始状态为隐藏。 11保存并在浏览器中测试行为，当鼠标指向“长影世纪城景观”时，层显示，离开时层隐藏。,2.7 显示隐藏层,2 使用Dreamwerver8内置的行为,1打开一个网页，插入两个按钮，按钮动作为“无”，绘制一个层，命名为Layer1，设置层的背景颜色为浅紫色，如图所示。 2选中“粉色”按钮。在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“改变属性

10、”。 3打开“改变属性”对话框，如图所示。,2.8 改变对象属性,2 使用Dreamwerver8内置的行为,4对话框各项设置如下： “对象类型”：选择要改变的类型。选择“LAYER” “命名对象”：从下拉菜单中选择要更改属性的对象名称，选择layer“Layer1”。 “属性”：设置要改变的属性名称及浏览器版本。改变背景选择“style.backgroundColor”，浏览器版本选择“IE4”。 “新的值”：设置新属性的值。输入“pink” 5单击“确定”，退出对话框。 6在行为面板设置事件为“OnMouseDown”。 7选中“绿色”按钮，添加“改变属性”，设置“新的值”为“green”

11、，事件为“OnMouseDown”。 8保存并在浏览器中测试行为。,2.8 改变对象属性,2 使用Dreamwerver8内置的行为,3 插入行为脚本,只要把特效代码复制、粘贴到你的网页源代码中，保存，再在浏览器中打开，就会看到效果了 。 如：设为首页 设为首页 特效代码集中营：,怎样在网页中插入代码,使用DreamWeaver： 在编辑状态下按F10即弹出源代码窗口，将特效代码粘贴进去即可。 一般来说在网页源代码的与之间的任何地方插入代码都可以（除非特别指明，例如要求插入到与之间） 提示：在与之间插入代码，一般不会出错。 该怎样修改代码？ 插入代码之后，把代码中的文字替换成你自己的内容即可。

12、注意：为避免出错，请不要改动除中文文字之外的代码，否则程序可能会不能运行！,双击页面自动滚屏效果, var currentpos,timer; function initialize() timer=setInterval(scrollwindow(),10); function sc() clearInterval(timer); function scrollwindow() window.scrollBy(0,1); document.onmousedown=sc document.ondblclick=initialize,在鼠标后面跟着一串飘动的字符, .spanstyle COLOR: #00cccc; FONT-FAMILY: 宋体; FONT-SIZE: 10pt; POSITI