第11讲_网页中的多媒体和特效.pptVIP

网页特效 在Dreamweaver CS4中，可以添加许多网页特效，例如鼠标特效、滚动条和页面特效等。常用的有弹出信息、交换图片、背景音乐、滚动字幕等 添加网页特效的方法 可以通过“行为”面板 在“代码”视图中添加代码 弹出信息 弹出信息是指在浏览网页时，鼠标点击对象(图片等)，会弹出信息窗口。 弹出信息创建步骤 选择网页中的图片 打开“行为”面板 选择“弹出信息” 打开“弹出信息”对话框 输入“信息内容” 示例1_弹出信息 选择main.html中图片，设置弹出信息。 鼠标经过图像 鼠标经过图像是指在浏览网页时，鼠标移动到某张图像上时，该图像会切换成另一张图像，移开鼠标时，恢复原来的图像。 鼠标经过图像方法1(网页中已插入原始图片) 选择网页中图片 打开“行为”面板 选择“交换图像” 打开“交换图像”对话框 选择需要交换的图像 鼠标经过图像方法2： (网页中无原始图片) 选择插入图片的位置 选择“插入/图像对象/鼠标经过图像”菜单命令 打开“插入鼠标经过图像”对话框 设置“原始图像”、“鼠标经过图像”和“链接网页” 示例3_鼠标经过图像2 在网页tk.html中设置鼠标经过图像特效 原始图像为“xj1.jpg”，鼠标经过图像为“xj2.jpg” 点击图像能打开“main.html”网页 图像大小设置为宽210，高260 滚动字幕 滚动字幕是指在网页中来回移动的文字 滚动字幕是通过快速标签编辑器来创建 选中文字 打开“修改”菜单，选择“快速标签编辑器” 打开“快速标签编辑器” 输入代码marquee behavior=“alternate” bgcolor=“#339900” style=“color:#FFFFFF” 滚动字幕中的常用参数 align 表示元素的垂直对齐方式，值可以是top，middle，bottom，默认为middle bgcolor 表示运动区域的背景色，值是16进制的RGB颜色，默认为白色 behavior 表示滚动的方式，值可以是scroll（连续滚动）slide（滑动一次）alternate（来回滚动） direction 表示滚动的方向，值可以是left，right，up，down，默认为left loop 表示循环的次数，值是正整数，默认为无限循环 scrollamount 表示运动速度，值是正整数，默认为6 scrolldelay 表示停顿时间，值是正整数，默认为0，单位似乎是毫秒 height、width 表示运动区域的高度和宽度，值是正整数（单位是像素）或百分数，默认width=100% height为标签内元素的高度 hspace、vspace 表示元素到区域边界的水平距离和垂直距离，值是正整数，单位是像素 onmouseover=this.stop() onmouseout=this.start() 表示当鼠标以上区域的时候滚动停止，当鼠标移开的时候又继续滚动。 marquee标记的默认情况 向左滚动无限次，字幕高度是文本高度 滚动范围：水平滚动的宽度是当前位置的宽度；垂直滚动的高度是当前位置的高度。 示例4_滚动字幕 在网页“main.htm”表格插入一行，并添加文字“欢迎光临E派网上冲印店” 选中文字，在“快速标签编辑器”中输入代码 marquee behavior=“alternate” bgcolor=“#339900” style=“color:#FFFFFF” Spry特效 Spry特效几乎可以应用于HTML页面中的任何元素，使用这些特效可以实现使网页元素发光、缩小、淡化、高光等效果。 Spry特效的行为包括显示/渐隐、遮帘、增大/收缩、高亮颜色、晃动、滑动、挤压等。 在网页中插入Spry特效 打开行为面板 选择“效果”中特效 设置鼠标事件 示例5_ Spry特效 设置点击网页main.html中图片设置Spry特效 增大/收缩 设置增大效果从10%变化到100%；事件为“onMouseOver” 显示/渐隐 设置渐隐效果；事件为“onClick” 晃动 事件为“onClick” 层 层是带有CSS样式的Div或Span代码，用于网页元素的精确定位。由于一个页面中可以拥有多个层，而不同的层之间可以相互重叠，通过设置透明度来决定每个层是否可见或者可见的程度，因而层可用来实现许多特效。 层就像是包含文字或图像等元素的胶片，按顺序叠放在一起，组合成页面的最终效果。层可以精确地定位页面上的元素，并且在层中可以加入文本、图像、表格、插件等元素，还可以插入嵌套层。 Ap Div特点 所谓AP Div，是指存放文本、图像、表单和插件等网页内容的容器。 AP Div最主要的特性就是它是浮动在网页内容之上的，可以在（不影响其他网页元素情况下）网页上任意改变其位置，实现对AP Di