| 网站首页 | 文章中心 | 电子书下载 | 矢量图库 | 视频教程 | 素材下载 | 程序代码下载 | JS代码 | 论坛 | 
常用软件类:
|杀毒安全 |联络聊天 |网络软件 |多媒体类 |系统工具 |图形图像 |系统工具 |应用软件 |行业软件
开发设计类:
|动画制作 |图像处理 |3D设计 |操作系统 |站长学院 |网络相关 |WEB设计 |数据库类 |程序开发
十二、动态与交互技术
作者:佚名    文章来源:网络    点击数:    更新时间:2006-11-13
 

1、           行为的使用
行为是实现网页上交互的一种捷径,它包含了事件和动作两个部分。例如,将光标移到网页上某张图片的上面,就显示一段文字。这个过程,可以分为两个部分:一是事件,也就是触发动作的条件,在这里为鼠标移上;二是动作,也就是显示内容。这两部分就构成了这个行为。
Dreamweaver常见的事件有:
onClick           单击鼠标        onDbclick             双击鼠标
     onKeypress     按键                onMouseDown          鼠标按下
     onMouseOut   鼠标移出        onMouseOver      鼠标移上
onMouseUp     鼠标抬起        onLoad       页面装载完成后
Dreamweaver常见的动作有:
  调用JavaScript              调用JavaScript的一段小程序
控制Shockwave 或 Flash      控制Flash动画播放
  拖曳图层                   实现拖动层
  前往URL                       可以实现自动转到另一页面
  跳页菜单                   实现下拉式列表中选中一个项目后,跳转到一个URL地址
  打开浏览器窗口            实现打开网页同时启动另一页面,多用做弹出消息页面
  播放声音                   实现网页打开时播放音乐
  弹出信息                   实现打开网页时,打开一个对话窗口。
  显示隐藏图层           显示或隐藏层
  对调图像                   图形交替显示
  恢复对调图像           重复前面的Swap Image功能
时间轴                      对用时间轴制作的动画进行控制:播放、停止、前往帧
设置文字                       又可选设置框架文字、图层文字、文字区域文字、状态栏文字
预载入图像              将不会立即显示在页面中的图片载入到浏览器的高速缓存中
(1) 添加行为:
Dreamweaver的行为面板是一个专门管理和编辑行为的工具,使用它可以在页面中添加、删除、修改各种行为或调整行为的执行顺序。
① 行为面板
选择菜单“窗口/行为”或按F8键就可打开行为面板。
“+”按钮:单击这个按钮,弹出动作列表菜单,从中选择上述要添加的动作;
“-”按钮:删除和某个动作及与之相关联的事件。在行为面板的动作列表中选定要删除的动作,然后单击“-”按钮。
“事件”下拉列表框:列出了不同类型和版本的浏览器,浏览器的类型决定了在事件列表中可以显示的事件;
“向上”、“向下”箭头按钮:这两个按钮用来调整行为面板列表中动作的执行顺序。
“事件”列表:当为某个对象添加了行为后,这个列表中将显示可以触发执行该动作的所有事件。
“动作”列表:显示添加的行为动作,双击某个动作选项,可以弹出动作的参数设置对话框。
“事件列表的菜单”按钮(“事件”列表右边的向下箭头):只有在选定某一个动作时,才会在相应的事件名旁出现此菜单的按钮。单击后可以列出触发当前动作的所有事件以供选择。
② 为对象添加行为
行为总是对应某个页面元素。首先在页面中选定要添加行为的对象。可以直接在文档窗口左下角的状态栏中选择定义对象的标签。如单击<body>选定整个页面作为对象等。
打开行为面板,从行为面板的“事件”下拉列表框中选择浏览器的版本和类型。
单击行为面板上的“+”按钮,从弹出的下拉菜单中选择一个动作。
在行为面板中,Dreamweaver会为新添加的动作选择一个缺省的事件,如果它不是用户想要选择的事件,单击事件名右边的箭头按钮,在事件列表菜单中选择另一个事件。
(2) 使用行为举例
① 弹出消息
这个行为可在访问者打开页面时,弹出一个对话框,单击对话框上的“确定”按钮即可关闭它。这在一些建议性消息中用的最多。
单击“Body”标记,在行为面板中,单击“+”按钮,在弹出的菜单中选择动作“弹出讯息”,输入消息文档,单击“确定”按钮完成。在事件列表菜单中选择“onLoad”事件。
按F12浏览。
② 在状态栏显示消息
在上面“弹出消息”的动作中,访问者必须单击对话框中的“确定”按钮,才能继续浏览。而“在状态栏显示消息”不会影响访问者的浏览,因此这个动作常与“onMouseOver”事件相配合。
选定对象,打开行为面板,单击“行为”对话框中的“+”按钮,在弹出的菜单中选择动作菜单“设置文字/设置状态栏文字”,输入消息文档,单击“确定”按钮完成。在事件列表菜单中选择“onMouseOver”事件。
③ 跳转页面
所谓跳转页面就是在当前的窗口或框架中,自动或按设定的事件打开一个新的页面。
单击“Body”标记,单击“行为面板”中的“+”按钮。在弹出的动作菜单中选择“前往URL”项,单击其右边的“浏览”按钮选择已有的页面,单击“确定”按钮。在事件列表菜单中选择“onLoad”事件.
④交换图片
此行为可使另一张图片来替代当前的图片,用于生成翻转按钮及其他特殊图像效果。
在文档中选定一张图片,打开行为面板,单击“+”按钮,选择动作菜单“对调图像”,在“设置原始文件”文本框中选择新图片的路径和文件名。选定“预载入图像”复选项,以防止新图片载入时的延时;选定“鼠标移出时恢复图像”复选项,使当鼠标移出图片上方时,图片自动恢复为交换前的图片,单击“确定”按钮。在事件列表菜单中选择“onMouseOver”事件。
⑤ 打开浏览器窗口
这个行为可在打开当前页面的同时或鼠标移到某个对象上时,再打开一个新的窗口,并且这个新打开的窗口,可以根据你的爱好,对它的菜单、大小属性进行设置。
在文档窗口选定一个对象,在“行为面板”中,单击“+”号按钮,选择动作菜单中的“打开浏览器窗口”项,在弹出的对话框中,对下面对各项进行设置选择:
“要显示的URL”、“窗口宽度”、“窗口高度”、“浏览工具栏”、“菜单栏”、“定位工具栏”、“滚动条”、“状态栏”、“更改大小控制点”、“窗口名称”。
单击“确定”按钮,完成设置。在事件列表菜单中选择“onMouseOver”事件。
⑥ 声音的播放控制
此动作用于播放一个声音文件。例如在页面载入后播放背景音乐。
在文档窗口选定“Body”,在“行为面板”中,单击“+”号按钮,选择动作菜单中的“播放声音”项,单击“播放声音”文本框右边的“浏览”按钮,选择一个声音文件,单击“确定”按钮。在事件列表菜单中选择“onLoad”事件。

[1] [2] 下一页


相关文章