网页制作第11单元流媒体VIP专享

第 11 单元 流媒体 课程目标：  掌握在网页中使用动画、音频、视频技术 建议学时：理论2学时，实践2学时。 11.1 使用动画 11.1.1 插入GIF动画 GIF动画也是网页设计中常用到的一种动画类型，制作GIF动画的软件也很多，如Photoshop套装软件中的ImageReady、Firework等均可很容易地制作GIF动画。GIF动画是以.gif文件格式存储的，在Dreamweaver8中可直接插入。 在Dreamweaver8中将GIF动画视为图像对待，插入GIF动画与插入一般的图像相同，插入后仅显示GIF动画中的第一帧，可以预览时看到其动画效果。 11.2.1 插入FLASH动画 Micromedia公司的FLASH动画制作软件功能强大，广泛用于制作网页动画和多媒体作品，由于其采用矢量图形式，制作完成的动画文件较小，同时支持边下载边播放，比较适合于在网上传播。在网页设计中常常使用到FLASH动画，以增加网页的动态效果。 （1）在网页中插入FLASH动画与插入普通的图像类似，执行菜单【插入】—【媒体】—【FLASH】，打开选择要插入的FLASH动画文件对话框。 （2）在对话框中选择FLASH文件（*.swf），即可将FLASH动画插入到插入点位置，出现FLASH动画占位符，如图11-1所示。 图11-1 插入FLASH动画 （3）单击【占位符】，在属性面板还可以进一步设置对象名、自动播放、参数等。如图11-2所示。 图11-2 FLASH动画属性面板 （4）在网页中还常常使用一种透明FLASH动画，把FLASH动画效果加在某个图像上，如图11-3、11-4所示，11-3是一个黑色背景的FLASH动画，要将其加放在图11-4上，可将图11-4设置为一表格（1行1列）的背景，然后再插入图11-3的FLASH动画。但此时需要在属性面板按下【参数】按钮，在出现的对话框中增加一个参数“w mode”，并设其值为“transparent”(透明)，如图11-5所示，设置透明后的效果如图11-6所示。 图11-3 FLASH动画 图11-4 Banner图形示例 图11-5 设置FLASH透明参数 图11-6 设置FLASH动画透明后与图像的叠加效果 插入的FLASH动画为什么不像GIF动画一样显示出画面，而是显示占位符呢？打开插入FLASH动画后的网页HTML代码，会发现插入FLASH动画后的代码如下：