在网页中添加flash元素.docx

1、在网页中添加flash元素在网页中添加flash元素实验要求 通过试验，掌握如何在网页中添加flash影片、flash文本和flash按钮的方法。 说明 macromedia flash技术是目前最为普及的矢量图形和动画传送解决方案。如今的flash影片已经在网页中广泛应用，增添了网页的动态效果。在dreamweavermx2004中不仅可以插入flash程序中创建的影片，还可以直接在文档中创建、插入和修改flash按钮和flash文本；这些操作均不需要macromedia flash的参与。 对应知识点1.插入flash动画2.添加flash按钮3.使用flash文本对应macromedia

2、dreamweavermx2004标准教程第8章的内容。试验课时;4课时实验素材swf格式的影片可在本书配套光盘中查找使用实验步骤1.dreamweaver mx 2004程序，选择菜单”文件“”新建”命令，创建HTML网页。保存网页为page10.htm.2.单击使用面板中的表格按钮，插入5行1列，宽度为777像素，边框粗细、单元格边距和单元格间距均为0的表格。3.选中表格，在属性面板中对齐下拉列表中选择居中对齐选项。4.在第一单元格内单击，使插入点定位在此单元格内。5.从本书配套光盘exp10sucai10文件夹中复制文件“1.swf”和”2.swf”,粘贴到任意一个磁盘的根目录下。这是我

3、们粘贴到盘内。如图10-1示6.返回dreamweaver编辑窗口，在常用面板的媒体列表中选择文本命令，如图所示。或者选择菜单”插入”媒体”flash文本”命令。 图10-1 将素材文件粘贴到F盘内 图10-2选择“Flash文本”命令 说明 flash文本对象允许用户创建和插入只包含文本的flash影片，使用它可以创建一个小的矢量图像影片，并定义所有需要的文字和文本。1. 开“插入flash文本”对话框。如图10-3所示。2. 设置文字为”MS UI Gothic”，大小为40，单击”粗体”和”左对齐”按钮,在”颜色”调色板中选择颜色为蓝色（色标值为#0000cc）,在“转滚颜色”调色板中选

4、择颜色为浅蓝色（色标值为=#6699ff)，在“文本”编辑框中输入英文”welcome to ”单击“另存为“编辑框右侧的”浏览”按钮，打开“选择文件“对话框，选择F盘根目录下的”1.swl“文件，确定后弹出dreamweaver提示窗口，如图10-4所示图10-3 “插入Flash文本”对话框图Dreamweaver提示窗口图10-5“插入Flash文件”对话框的设置3. 单击”是”按钮，在另存为“对话框“中显示了文件路径和名称，此时“插入flash文本“对话框。如图10-5所示。 图10-6 Flash文本的预览效果 说明 如果需要为flash文本对象创建一个链接，则可以在“链接“编辑框中

5、输入所需的URL地址。在输入了链接地址之后，用户还可以在“目标”列表中指定打开所链接文档的目标框架或目标窗口。4. 单击“确定”按钮，flash文本插入到单元格内，单击属性面板中的“播放”按钮 ，flash 文本效果显示在网页中。如图10-6 5. 单击停止按钮，取消播放。选中flash文本时，属性面板如图10-7所示。 说明在属性面板，单击编辑按钮，将调出flash编辑对话框。单击重设大小“按钮，将选定的flash对象大小恢复到原始大小。在垂直边距和水平边距编辑框中，指定flash对象四周的间隔。在”品质”列表中选择flash文件播放的效果。影片在“高品质”下效果会更好，但相对需要更快的计算

6、机配置。12.将光标定位在第三行单元格内，单击常用面板中的”flash”按钮 ，或选择菜单“插入”“媒体”“flash”命令，打开”选择文件“对话框。找到本书配套光盘sucai10文件夹中的素材文件” banner.swf”,选择此文件。如图10-8所示。13.单击“确定”按钮，flash影片立即被插入到单元格中，在文档窗口中将出现一个flash 占位符。要在文档窗口中观看flash影片的预览，可单击属性面板的“播放”按钮。如图所示。 说明当用户向文档中插入flash影片时，dreamweaver将同时使用object标签（由internet explorer 为active x 控件定义）和

7、embed标签（由netscape navigaror 定义），以期在所有浏览器中获得最佳效果。当用户在属性面板中修改该影片属性时，dreamweaver 会将所输入数据分别影射为 图10-8“选择文件”对话框与object和embed标签相对应的合适的参数。14.单击”停止“按钮，停止flash 影片的播放。Flash 的属性面板与flash文本的相同。15.将光标定位在第5行单元格内，在常用面板的媒体列表中选择”flash按钮“的命令。如图10-10所示。 图10-9插入的Flash影片播放效果 图10-10选择Flash按钮命令 提示 也可以选择菜单 “插入”“媒体”“Flash按钮”命

8、令。16.打开如图10-11所示的“插入flash 按钮“对话框。17.在对话框“样式“列表中有许多不同的flash按钮风格，选择”blue warper”选项，在“范例”框中选择字体“Verdana”（或其他字体）。在“大小”编辑框内输入“16”（单位：像素）。可以单击“链接”编辑框右侧的“浏览”按钮，选择链接的网页，也可以直接在编辑框内输入链接路径，例如：。在“目标”列表中选择“_blank”选项，当点击按钮时弹出一个新窗口。单击“另存为”右侧的“浏缆”按钮，在“选择文件”对话框中，选择保存在F盘的替换文件“2.swf”。如图10-12所示。 18.系统将弹出“提示框”，询问是否覆盖此文件

9、。单击“是”按钮，原来的swf文件被替换，其路径和文件名将显示在“另存为”编辑框中，“插入Flash按钮”设置完成效果如图10-13所示。19.在属性面板中，单击“播放”按钮，可以看见Flash按钮的动态效果。如图10-14所示。 图10-13 “插入Flash按钮”对话框 图10-14 Flash按钮的动态效果20.单击“停止”按钮，停止Flash按钮的播放。Flash按钮的属性面板与Flash文本的相同。21.双击“Flash按钮”，可以再次打开图10-13所示的对话框，进行重新编辑。编辑完成，单击“确定”即可。 说明 若要预览页面中的所有Flash内容，按Ctrl+Alt+Shift+P

10、键。所有的Flash对象和影片将开始播放。22.选择菜单“文件”“-保存”命令，完成网页保存。按F12键在浏览器中查看网页效果。如图10-15所示。实验作业模仿1 创建网页，保存page10.htm。2 在网页中插入表格，布局Flash元素。3 插入Flash文本，设置文本显示为“Welcome to .。”4 插入在Flash程序中制作的Flash影片。5 创建Flash按钮文件，设置显示文字为“Enter”,并创建链接。创作1 在网页中创建若干个Flash文本和Flash按钮。2 使用表格或布局单元合理布局网页，使其形成完整的网页结构。3 适当的位置插入Flash影片，作为主体内容。4 灵活使用Flash文件和Flash按钮等元素，增添网页动感。在本书配套光盘exp10site10文件夹中有若干网页提供参考，如图10-16图10-18所示。图10-16 网页中添加Flash元素图10-17 网页中添加Flash元素图10-18 网页中添加Flash元素实验报告实验名称姓 名班级分组实 验 室实验时间： 年 月 日实验步骤序 号步 骤操作要领实验结果