网页设计-行为_第1页
网页设计-行为_第2页
网页设计-行为_第3页
网页设计-行为_第4页
网页设计-行为_第5页
已阅读5页，还剩29页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

行为教师：刘抗E-mail：sqlk007@网页设计-行为全文共34页，当前为第1页。$

[知识目标]

了解Dreamweaver8中的行为掌握Dreamweaver8内置行为的添加方法掌握行为的设置流程，及应用方法8

[能力目标]

掌握行为面板的使用熟练内置行为的添加与应用操作第8章在网页中使用行为网页设计-行为全文共34页，当前为第2页。8.1认识行为8.2使用Dreamwerver8内置的行为本章小结第8章在网页中使用行为网页设计-行为全文共34页，当前为第3页。8.1认识行为8.1.1认识行为8.1.2使用行为面板8.1.3增加行为的基本步骤8.1.4修改行为网页设计-行为全文共34页，当前为第4页。行为是由对象、事件和动作构成的。

1．对象：是产生行为的主体。网页中的很多元素都可以成为对象，如网页中的一个图片、一段文字等元素，也可以整个网页文档。

2．事件：是由用户或浏览器触发的事件。事件经常是针对页面元素的，如鼠标经过、鼠标单击、键盘某个键按下等。

3．动作：通常是一段JavaScript代码，用于完成某些特殊的任务。如打开一个窗口时自动播放声音、弹出信息窗口等。

4．行为：事件和动作组合起来就构成了行为。事件是产生行为的条件，动作是行为的具体结果。8.1.1认识行为8.1认识行为网页设计-行为全文共34页，当前为第5页。单击菜单栏中的“窗口”|“行为”命令或使用组合键Shift+F4，可以打开行为面板如图所示。（一）行为面板各按钮功能（二）设置浏览器版本在行为面板中，单击按钮，在

“显示事件”的级联菜单中选择浏览

器版本，如图所示。8.1.2使用行为面板8.1认识行为网页设计-行为全文共34页，当前为第6页。

（三）常见事件添加行为后，要为行为选择触发事件。选择某个行为，单击左侧的事件名称右侧的下拉箭头弹出下拉菜单，菜单列出了所选行为可以使用的触发事件，如图所示。8.1.2使用行为面板8.1认识行为网页设计-行为全文共34页，当前为第7页。

1．在文档窗口中选择要增加行为的对象，例如一个图像或一个链接或一段文字。要将行为附加到整个页，请在“文档”窗口底部左侧的标签选择器中单击<body>标签。

2．在行为面板中单击加号“+”按钮，从弹出菜单中选择一种行为。

3．打开某种行为的设置对话框，根据需要进行设置，完成对话框。

4．在行为面板中选择行为，添加触发事件。

6．保存网页，在浏览器中检测行为。8.1.3增加行为的基本步骤8.1认识行为要修改和编辑己设置行为,执行以下操作之一：

1．在行为面板中双击要修改的行为。

2．选择要修改的行，单击行为面板上的“选项”按钮，选择“编辑行为”命令。8.1.4修改行为网页设计-行为全文共34页，当前为第8页。8.2使用Dreamwerver8内置的行为8.2.1播放声音8.2.2打开浏览器窗口8.2.3弹出消息8.2.4转到URL8.2.5设置状态栏文本8.2.6拖动层8.2.7显示—隐藏层8.2.8检查浏览器8.2.9改变对象属性8.2.10控制Shockwave或Flash网页设计-行为全文共34页，当前为第9页。

1．打开一个网页，选择行为的对象如某一图像，也可单击窗口下方的<body>标签，为整个页面增加行为。

2．在行为面板上，单击“+”按钮，从下拉菜单中选择“播放声音”。

3．打开“播放声音”对话框。

4．在文本框中输入声音文件的路径和名称，也可单击“浏览”按钮，选择要播放的声音文件。

5．单击“确定”按钮。在网页中出现占位符。

6．在行为面板设置事件，如设为“OnLoad”。

7．保存并在浏览器中预览网页，观看效果。8.2.1播放声音8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第10页。

1．打开一个网页，选择行为的对象如某一图像，如选择一个图像。

2．在行为面板上，单击“+”按钮，从下拉菜单中选择“打开浏览器窗口”。

3．打开“打开浏览器窗口”对话框，如图所示。

4．设置对话框，单击“确定”按钮。５．在行为面板设置事件，如设为“OnMouseOver”

6．保存并在浏览器中测试行为。8.2.2打开浏览器窗口8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第11页。

1．打开一个网页，选择行为的对象，如选择一个图像。

2．在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“弹出消息”。

3．打开“弹出消息”对话框，如图所示。

4．输入要显示的信息，单击“确定”按钮。

5．在行为面板设置事件，如设为“OnMouseDown”

6．保存并在浏览器中测试行为。8.2.3弹出消息8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第12页。

1．打开一个网页，插入一个按钮，在“属性检查器”中设置“动作”为“无”。

2．选中按钮。在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“转到URL”。

3．打开“转到URL”

对话框，如图所示。

4．在“URL”框中

输入要打开的文件的

路径和名称，也可单

击“浏览”按钮选择文件。

5．单击“确定”按钮。

6．在行为面板设置事件，如设为“OnMouseDown”

7．保存并在浏览器中测试行为8.2.4转到URL8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第13页。

1．打开一个网页，选择窗口下方的<body>标签。

2．在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“设置文本”子菜单中的“设置状态栏文本”。

3．打开“设置状态栏文本”对话框，如图所示。

4．输入要显示的信息，单击“确定”按钮。

5．在行为面板设置事件，如设为“OnLoad”。

6．保存并在浏览器中测试行为。8.2.5设置状态栏文本8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第14页。

1．打开一个网页，插入一个层，命名为layer1，在层插入图像。

2．选择窗口下方的<body>标签。

3．在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“拖动层”。

4．打开“拖

动层”对话框，

如图所示。

5．在“基本”选项中，选择要拖动的层，其他使用默认设置。

6．单击“确定”按钮，退出“拖动层”对话框。

7．在行为面板设置事件为“OnLoad”。

8．保存并在浏览器中测试行为。8.2.6拖动层8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第15页。

1．打开一个网页，输入“长影世纪城景观”，并设置空链接。

2．插入一个层，命名为“Layer1”，在层中插入图像，如图所示

3．选中“长影世纪城景观”，

在行为面板上，单击“+”按钮，

打开下拉菜单，从中选择

“显示—隐藏层”。４．打开“显示—隐藏层”

对话框，如图所示。8.2.7显示—隐藏层8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第16页。

5．在“命名的层”中显示了所有的层，选择“Layer1”。

6．单击“隐藏”按钮，然后单击“确定”，退出“显示—隐藏层”对话框。

7．在行为面板设置事件为“OnMouseOut”。

8．重新选择“长影世纪城景观”文本，打开“显示—隐藏层”对话框，选择“Layer1”，单击“显示”按钮，确定退出对话框将行为事件设为“OnMouseOver”。行为面板显示如图所示。

10．选中网页的层，在属性检查器中设置“可见性”为“hidden”，使层初始状态为隐藏。

11．保存并在浏览器中测试行为，

当鼠标指向“长影世纪城景观”时，

层显示，离开时层隐藏。8.2.7显示—隐藏层8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第17页。

1．打开一个网页，选择窗口下方的<body>标签。

2．在行为面板上，单击“+”按钮，打开下拉菜单，从中选择“检查浏览器”。

3．打开“检查浏览器”对话框，如图所示。8.2.8检查浏览器8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第18页。

4．对话框各项设置如下：“NetscapeNavigator”：用于设置NetscapeNavigator浏览器的版本及打开的网页。“InternetExplorer“：用于设置InternetExplorer浏览器的版本及打开的网页。“其他浏览器”：设置对于其他浏览器的选项设置，。“URL”：用于设置要跳转的地址，单击“浏览”按钮可以选择跳转的文件。“替代URL”：用于设置替代的URL，也可以单击“浏览”按钮选择文件。

5．设置完成后，单击“确定”退出对话框。

6．在行为面板设置事件为“OnLoad”。

7．保存并在浏览器中测试行为。8.2.8检查浏览器8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第19页。

1．打开一个网页，插入两个按钮，按钮动作为“无”，绘制一个层，命名为Layer1，设置层的背

景颜色为浅紫色，如图所示。

2．选中“粉色”按钮。在行为

面板上，单击“+”按钮，打开下拉

菜单，从中选择“改变属性”。

3．打开“改变属性”对话框，

如图所示。8.2.9改变对象属性8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第20页。

4．对话框各项设置如下：“对象类型”：选择要改变的类型。选择“LAYER”“命名对象”：从下拉菜单中选择要更改属性的对象名称，选择layer“Layer1”。“属性”：设置要改变的属性名称及浏览器版本。改变背景选择“style.backgroundColor”，浏览器版本选择“IE4”。“新的值”：设置新属性的值。输入“pink”

5．单击“确定”，退出对话框。

6．在行为面板设置事件为“OnMouseDown”。

7．选中“绿色”按钮，添加“改变属性”，设置“新的值”为“green”，事件为“OnMouseDown”。

8．保存并在浏览器中测试行为。8.2.9改变对象属性8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第21页。

1．打开一个网页，插入两个按钮，按钮动作为“无”，插入一个Flash，在属性检查器中命名为“flash1”并将“自动播放”和“循环”选项取消，如图所示。

2．选中“play”按钮。在行为

面板上，单击“+”按钮，打开下拉

菜单，从中选择“控制Shockwave

或Flash”。

3．打开“控制Shockwave或

Flash”对话框，如图所示。8.2.10控制Shockwave或Flash8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第22页。

4．在“影片”下拉列表中选择“flash1”，“操作”选项中选择“播放”。

5．单击“确定”，退出对话框。

6．在行为面板设置事件为“OnClick”。

7．选中“stop”按钮，添加“控制Shockwave或Flash”，“操作”选项中选择“停止”。

8．保存并在浏览器中测试行为。8.2.10控制Shockwave或Flash8.2使用Dreamwerver8内置的行为网页设计-行为全文共34页，当前为第23页。本章小结第8章在网页中使用行在网页中使用行为认识行为使用内置的行为认识行为使用行为面板增加行为的基本步骤修改行为播放声音打开浏览器窗口弹出消息转到URL设置状态栏文本拖动层显示—隐藏层检查浏览器改变对象属性控制Shockwave或Flash网页设计-行为全文共34页，当前为第24页。4.3可选择的行为鼠标行为和键盘事件表单事件浏览器窗口行为其他事件网页设计-行为全文共34页，当前为第25页。鼠标行为和键盘事件

——Onclick事件鼠标单击选定对象时触发该事件（body）<scriptlanguage="javascript">functiona(){alert(‘你好’)}</script>插入你的按钮，在设置按钮属性onclick=“a()”网页设计-行为全文共34页，当前为第26页。鼠标行为和键盘事件

———onmouseover鼠标指针位于对象上方时触发行为<fontonMouseOver=“alert(‘这是什么’)”>你好啊</font>网页设计-行为全文共34页，当前为第27页。

鼠标行为和键盘事件

——onmouseout鼠标指针离开对象上方时触发行为<fontonMouseOut=“alert(‘这是再问候你呢’)”>你好啊</font>网页设计-行为全文共34页，当前为第28页。表单事件

——onchange浏览者修改表单初始值发生变化触发该事件<scriptlanguage="javascript">functiona(){alert(“asd发生变化了")}</script>插入一个文本框，将初始值设为asd.在文本框调用函数onchange网页设计-行为全文共34页，当前为第29页。表单事件

——on

人人文库> 全部分类> 行业资料 > 信息产业

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论