第09章 网页特效与交互.pptVIP

第9章 网页特效与交互 9.1 行为 9.2 AP元素 9.3 制作AP元素动画 9.4 Spry框架 9.5 JavaScript入门 9.1.1 附加行为 9.1 行为 1．添加行为的方法 2．修改行为 9.1.2 课堂实例――网页加载时弹出公告页 9.1 行为 1．制作用做公告页的网页文档 2．在另一个网页中添加“打开浏览器窗口”行为 3．设置事件 4．Javascript代码 9.1.3 内置行为功能详解 9.1 行为 动作名称 动作的功能 交换图像 发生设置的事件后，用其他图片来取代选定的图片。此动作可以实现图像感应鼠标的效果 弹出信息 设置事件发生后，显示警告信息 恢复交换图像 此动作用来恢复设置“交换图像”，却又因为某种原因而失去交换效果的图像 打开浏览器窗口 在新窗口中打开URL。可以定制新窗口的大小 拖动AP元素 可让访问者拖动绝对定位的（AP）元素。使用此行为可创建拼板游戏、滑块控件和其它可移动的界面元素 改变属性 使用“改变属性”行为可更改对象某个属性（例如div的背景颜色或表单的动作）的值 效果 这是Dreamweaver CS3新增的行为。“Spry效果”是视觉增强功能，可以将它们应用于使用JavaScript的HTML页面上几乎所有的元素 时间轴 用来控制时间轴的动作。可以播放、停止动画，或者移动到特定的帧上 显示-隐藏元素 可显示、隐藏或恢复一个或多个页面元素的默认可见性 检查插件 确认是否设有运行网页的插件 检查表单 能够检测用户填写的表单内容是否符合我们预先设定的规范 设置导航条图像 制作由图片组成菜单的导航条 设置文本 (1)设置容器的文本：在选定的容器上显示指定的内容 (2)设置框架文本：在选定的框架页上显示指定的内容 (3)设置文本域文字：在文本字段区域显示指定的内容 (4)设置状态条文本：在状态栏中显示指定的内容 调用JavaScript 事件发生时，调用指定的JavaScript函数 跳转菜单 制作一次可以建立若干个链接的跳转菜单 跳转菜单开始 在跳转菜单中选定要移动的站点后，只有单击“开始”按钮才可以移动到链接的站点上 转到URL 选定的事件发生时，可以跳转到指定的站点或者网页文档上 预先载入图像 为了在浏览器中快速显示图片，事先下载图片之后显示出来 9.2.1 课堂实例——创建AP元素 9.2 AP元素 1．插入AP 元素 2．为AP元素添加内容 3．AP元素的可见性 4．AP元素的重叠 9.2.2 AP元素的属性详解 9.2 AP元素 1．单个AP元素的属性 2．多个AP元素的属性 9.3.1 时间轴面板 9.3 制作AP元素动画 1．时间轴面板 2．播放选项 9.3.2　课堂实例——制作滚动字幕效果 9.3 制作AP元素动画 1．创建AP元素 2．将AP元素添加到时间轴 3．添加关键帧 4．设置时间轴参数 9.4.1 Spry效果 9.4 Spry框架 Spry效果包括下列几种类型。 增大/收缩：使元素变大或变小。 挤压：使元素从页面的左上角消失。 显示/渐隐：使元素显示或渐隐。 晃动：模拟从左向右晃动元素。 滑动：上下移动元素。 遮帘：模拟百叶窗，向上或向下滚动百叶窗来隐藏或显示元素。 高亮颜色：更改元素的背景颜色。 9.4.2 Spry控件 9.4 Spry框架 1．插入Spry控件 2．选择和编辑Spry控件 3．设置Spry控件的样式 控件样式是由CSS控制的。要想更改控件的外观，可以对相应的CSS文件进行编辑。在站点的SpryAssets文件夹中找到与该控件相对应的CSS文件，并根据需要对CSS进行编辑。 9.4.3 课堂实例——网页导航菜单 9.4 Spry框架 1．插入“Spry菜单栏”控件 2．编辑“Spry菜单栏”控件 9.5.1 script标签 9.5 JavaScript入门 html head … script language=” JavaScript” !- //在这里集中放置脚本代码，定义函数 … -- /script /head body … script language=” JavaScript” //这里调用在HEAD部分定义的脚本程序（函数） … /script … /body /html 9.5.2 课堂实例—— 编写一个简单的JavaScript程序 9.5 JavaScript入门 本节通过编写一个简单JavaScript程序制作一个带链接的水平滚动字幕效果，在网页中，这种效果一般