网页中的图像和动画元素讲解
第5章 网页中的图像和动画元素 （3课时）,掌握图像映射 掌握FW编辑图像并共享文件 掌握FW与DW结合使用 掌握网页中插入FLASH及参数设置 了解网页图像类型、图像插入及属性设置 了解在网页中应用多媒体,掌握Dreamweaver MX中图像的插入 掌握Dreamweaver MX中热区图和轮替图的应用,教学目标：,教学重难点：,一、DW中的图象处理实例,*.GIF（图形交换格式） *.JPG（联合专家组格式） *.PNG（可移植网络图形）,1、网页插入图片：, 执行菜单 Insert image 命令 在 Object 面板上选 按快捷键 Ctrl + Alt +I 从其他地方（如桌面、资源管理器或站点窗口）中直接将图像文件的图标拖入到文档页面中 。,A、图片格式,B、插入图片：,4、创建图像映射：,2、设置图像的对齐方式：,3、调整图像的大小：,5、设定图像外部编辑器 （CTRL+U）,二、使用FW编辑图像并共享文件 1、使用FW编辑DW中的图像 2、使用DW和FW结合创建网络相册 执行“命令”-“创建网站相册”,三、插入图象占位符：,执行菜单“插入”“图象”“图象占位符” 通过在“常用面板”上选择,四、插入鼠标经过图象,执行菜单“插入”“图象”“鼠标经过图象” 通过在“常用面板”上选择,五、插入导航条图象：,执行菜单“插入”“图象”“导航条图象” 通过在“常用面板”上选择,注：导航条图象又分为： 状态图象、鼠标经过、鼠标按下、按下时经过；四个状态,六、插入Fireworks HTML图象,执行菜单“插入”“图象”“Fireworks HTML图象” 通过在“常用面板”上选择,七、在网页中插入FLASH动画,1、插入flash: 方法： “插入”-“媒体”-“flash” 2、设置FLASH动画的播放属性参数设置： wmode=transparent 3、插入flash文本：“插入”-“媒体”-“flash文本” 4、插入flash按钮：“插入”-“媒体”-“flash按钮”,注：插入“flash文本”与“flash按钮”注意事项；,八、控制页面中的flash动画:,在页面中插入flash动画，利用按钮的来控制动画播放、停止或跳转。 1、在页面中插入flash动画，并在属性面板中将其名； 2、输入相关文字，创建空链接； 3、在行为面板中选择“控制Shockwave或Flash”,九、flash元素图象查看器:,图像查看器的功能像播放幻灯片一样的效果来播放图片。 1、插入Flash元素-图象查看器，保存影片 2、打开标签检查器F9，进行相关设置。,bgColor指定影片的背景色 captionColor指定影片的各图像Slide的标题文本颜色 captionFont指定影片的各图像Slide的标题文本字体 captionSize指定影片的各图像Slide的标题文本字号 frameColor当frameShow为“是”，指定影片边框的颜色 frameShow指定“否”，指不显示影片边框 frameThickness指定“是”，指定影片边框的宽度 frameCaptions指定显示在影片各图像Slide下面的标题文本,imageLinks指定显示在影片的各图像Slide时移动的超级链接地址 imageLinkTarget指定在imageLinks中设置的超链接的目标 imageURLs指定显示在影片的各图象Slide中的图像文件路径 showControls指定为“是”时，隐藏控制按钮 showAutoPlay指定为“是”时，自动运行Slide Show动画,showDelay指定运行Slide Show动画时各图像Slide的延迟时间 slideLoop指定为“是”，循环进行Slide Show动画 Title输入显示在控制铵钮左侧的影片标题 titleColor指定影片标题的文字颜色 titleFont指定影片标题的字体 titleSize指定影片的字号,None不应用图像切换特效，直接显示图像 Blind图像以矩形百叶窗形式进行切换的特效 Fade逐渐显示其他图像的切换特效 Fly图像从左侧飞来 Iris从中央逐渐显示为矩形 Photo与其他图像重叠，同时表现一次闪烁效果的切换特效 PixelDissolve图像显示为多个正方形形态,图像变换时通过Transtions Type参数,Rotate图像从右上角向对角线方向显示 Squeeze图像从左侧向右侧逐渐放大显示 Wipe从左侧开始显示为矩形形态 Zoom从左上角开始向对角线方向逐渐放大显示 Random图像随意变形显示,插入Shockwave动画，需要插件支持。,十、插入Shockwave动画,总结： 一个优秀的网站应该不只是由文本和图像组成的，而是动态的、多媒体的，因此用户可以插入Flash动画等。,课堂作业： 插入一幅图片，请问如何在FW编辑图像； 插入flash_，参数设置为：_。 设定图像外部编辑器快捷键为： A、CTRL+U B、SHIFT+Q C、CTRL+Q D、 SHIFT +U 上机作业： 请你将班级同学的照片处理成像册，在页面中插入Flash动画及flash导航。,
