清华网作4.pptVIP

网页制作 计算机文化基础课程电子讲稿 2008年11月 本次大课的内容提要 制作Gif动画 制作横幅文字（1） 制作横幅文字（2） 用视频片段制作 GIF 动画 图层的使用 图层的编辑 图层的编辑 时间轴 制作时间轴动画 行为 使用行为 利用图层实现下拉菜单（1） 利用图层实现下拉菜单（2） 让图层中的对象沿路径动起来 让图层中的内容动起来（1） 让图层中的内容动起来（2） 调整多个图层的叠放顺序 CSS样式 CSS样式 去除超链接的下划线 定义文字样式 网页特效 网页特效制作 网页中插入特效代码 在什么地方插入代码? 可动图片特效（1） 可动图片特效（2） 简单的Javascript样例1 简单的Javascript样例1 简单的Javascript样例2 简单的Javascript样例2 网页作业补充 参考资料 html head title/title script language=javascript !-- today=new Date(); document.write(今天日期是: ,today.getMonth()+1, /, today.getDate(),/,today.getYear()); -- /script /head body /body /html 嵌入的javascript以script language=“javascript”开头，以/script结束。 !-- 和 --符号用于使脚本跳过没有脚本处理能力的浏览器。 today=new Date() 创建日期对象 document.write(“今天是…) 输出“今天是…” getDate()是Date对象的一种方法，其功能是获得当前的日期。 html head script language=javascript function message(){ alert(欢迎光临!); } /script /head body onload=message() /body /html html head script language=javascript function message() { alert(欢迎光临!); } /script /head body onLoad=message() /body /html function 函数名(参数列表) { 函数体 } alert() 以对话框显示信息 Javascript的方法 onLoad 元素装载 javascript的事件 事件是浏览器响应用户操作的机制，如单击链接按钮时，便产生一个事件。浏览器总在等待事件发生，并在发生事件时，进行相应的处理。处理的过程称为事件处理，进行这种处理的代码称为事件处理器。 * * HTML 图层、时间线、行为及其应用 网页特效的应用 参考资料 动态Gif图像制作小结 网页作业注意事项 样式表应用 添加图像 改变画布大小 选定范围工具：魔术棒 自动创建 手动创建 先创建一个空白的动画文档，然后在 “帧”菜单中选择 “添加横幅文本” 在文本标签中设置字体、字号、颜色、阴影等效果 设置文字动画效果 设置帧画面的延迟时间 添加霓虹效果 最终效果 1. 创建一个新的空白动画。 2. 单击标准工具栏上的“添加视频”按钮。 3.选取影片文件，单击“区间”按钮。 4.打开“区间”对话框，利用“开始标记”和“结束标记”选取视频片段。 5. 单击“确定”按钮，关闭“区间”对话框，返回到“添加视频”对话框。单击“打开”按钮，所选择的帧就被加载到 GIF Animator 中。 示例 网页中的元素，如文本、图像，都可以放置到图层中，图层不仅具有表格的平面布局网页对象的功能，而且可以使网页中的对象在空间垂直方向（Z轴）上互相重叠，再配合时间轴（Timeline）的应用可以做出很多效果，使网页动感十足，还可以配合行为（Behaviors），使得网页在某种事件发生时显示隐藏的指定图层等。 绘制图层按钮 用鼠标拖动的方法画出一个任意尺寸大小的图层。 参阅教材9.6.2节内容 图层标记 闪烁插入光标 黑色的图层边框 激活图层：单击图层中任一位置，图层只有被激活后才可以插入对象。 选取图层：单击图层边框或单击文档窗口状态栏左侧的层标记div#图层名图标 ，或单击图层图标。 选中的图层四周出现8个黑色的小方块。 移动图层 ：选中图层时，可用鼠标拖动图层的边框移动图层的位置，或者在“图层”属性面板中精确设置图层的新位置（左和上的值）。 改变图层尺寸 ：选中图层时，可用鼠标拖动图层四周的小方块调整图层的尺寸，或者在“图层”属性面板