后页 退出前页第 8章 网页制作基础(第二讲)
8.2 Flash动画制作
8.2.1 Flash简介
Flash是 MACROMEDIA公司于 1999年 6月推出的优秀网页动画设计软件。 Flash是一种既简单直观又功能强大的动画设计工具,它具有以下特点:
1、使用矢量图形和流式播放技术
2、通过使用关键帧和图符使得所生成的动画 (.swf)
文件非常小
3、把音乐、动画、声效交互方式融合在一起后页 退出前页
4、强大的动画编辑功能使得设计者可以随心所欲地设计出高品质的动画,通过 ACTION和 FS COMMAND可以实现交互性,使 Flash具有更大的设计自由度总之,Flash已经慢慢成为网页动画的标准,
成为一种新兴的技术发展方向。
8.2.2 Flash中涉及的基本概念
(一)帧( frame)动画是由一幅幅变化连续的静态画面组成,每幅静态画面被称为一帧
(二)图层( Layer)形象地说,图层可以看成是叠放在一起的透明的胶片,图层是 Flash中最基本而且重要的内容,因而需要很好地掌握后页 退出前页
(三)事件( Events)事件是指 windows平台下发生的某种动作如:鼠标移动、键盘有按键等。事件也可以是用户自己定义的特定动作,这些特定动作是用户触发其它动作的引子
(四)动作 (Actions) 动作是指在事件发生后,将要对该事件进行处理的一系列动作的统称
(五)脚本( Score)脚本就是指每帧画面出现的时机及滞留时间的具体安排等信息
(六)电影发布( Pubishing)电影发布是指使用 Flash制作完成的动画经过打包生成独立的可以被网页调用的文件的这一过程后页 退出前页
8.2.3 Flash的制作要点
8.2.3.1 Flash工作环境
Flash的工作环境大致就包括这几个部分,以下分别作简要介绍:
后页 退出前页
( 1)舞台 (Stage),就是工作区,最主要的可编辑区域
( 2)时间轴窗口 (Timeline) 用它可以调整电影的播放速度
( 3)绘图工具栏 (Drawing Toolbar) 放置了可供图形和文本编辑的各种工具
( 4)标准工具栏 (Standard Toolbar) 列出了大部分最常用的操作,便于进行更为快捷的操作
( 5)图库窗口 (Library Window) 用以存放可以重复使用的称为符号的元素
( 6)控制器面板 (Controller) 控制电影的播放操作的工具集合
8.2.3.2 Flash的基本操作后页 退出前页
1、舞台的基本操作新增舞台窗口 自动排列多个舞台窗口改变舞台显示内容 改变舞台显示比例
2、时间线控制栏的基本操作移动动画播放指针 切换当前层切换当前帧 查看当前帧信息改变时间线控制栏 /窗口中帧的显示状态
3、场景的基本操作切换当前场景 新增加场景删除场景 移动场景列表中的顺序为当前场景更名 复制当前场景
4、设置舞台中作品的大小后页 退出前页
5、设置作品的的背景色
6、设置动画的播放速度
7、色彩的选择和操作
8,Flash的出版和预览动画出版的具体操作步骤如下:
( 1) 文件的出版设置后页 退出前页
( 2) 文件的出版预览
( 3) 文件的出版
8.2.3.3 Flash中 Actions(动作 )介绍
Go To(转到),默认是转到某一帧然后停止播放
Play (播放),开始播放已经停止了的动画后页 退出前页
Stop(停止):停止正在播放的动画
Toggle High Quality( 切换高质量画面 )
Stop All Sounds(停止所有声音 )
Get URL(获取 URL )
FS Command(发出 FS Command命令 )
Load/Unload Movie( 加载 /卸载动画 )
Tell Target(告知目标 )
If Frame Is Loaded(如果帧已被加载 )
On MouseEvent( 鼠标事件 )
If(如果 ) Loop( 循环 ) Call(调用)
Set Property(设置属性) Set Variable(设置变量)
Drag Movie Clip(拖动电影夹子)
后页 退出前页
8.2.3.4 Flash动画的制作流程一般 Flash动画制作分为以下几个阶段:
1,动画创意阶段
2,动画资源收集阶段
3,动画制作阶段
4,动画修改和发布阶段后页 退出前页
<OBJECT WIDTH="550" HEIGHT="400">
<PARAM NAME="MOVIE" VALUE="tutorial.swf">
<EMBED SRC="tutorial.swf,WIDTH="550" HEIGHT="400">
</EMBED>
</OBJECT>
8.2.3.5 将 Flash动画嵌入网页总结,Flash是一个优秀制作动画的可视化工具,只有通过多读 Flash动画实例,多动手制作 Flash
动画,才能熟练的掌握 Flash制作要领 。
后页 退出前页
8.3 JavaScript语言
8.3.1 JavaScript 语言简介
JavaScript是一种基于对象 (Object)和事件驱动
(Event Driven)并具有安全性能的脚本语言。 具有以下几个基本特点:
1、一种脚本编写语言
2、基于对象的语言
3、简单性
4、安全性
5、动态性
6、跨平台性
7、节省 CGI的交互时间后页 退出前页
8.3.2 JavaScript与 Java
JavaScript语言和 Java语言是相关的,但它们之间的联系并不像想象中的那样紧密,二者的区别体现在:
( 1)两个公司开发的不同的两个产品
( 2) JavaScript是基于对象,而 Java是面向对象
( 3)在其浏览器中所执行的方式不一样
( 4) 所采取的变量是不一样
( 5) 代码格式不一样
( 6) 嵌入方式不一样
( 7) 静态绑定和动态绑定后页 退出前页
JavaScript 只有唯一的变量定义方式,var
variablement。 变量定义的关键字是 var,变量名称是 variablement。 Javascript的变量名必须遵循以下命名规则:
大,小写英文字母和数字构成
变量名中只能包含下划线符号,不能包含其它符号
变量名区分大小写
变量名不允许是 JavaScript的保留字
变量命名最好把变量的意义与其代表的意思对应起来
JavaScript支持的数据类型:数字,字符串,布尔值
Null( 空值 ) 和对象
8.3.3 数据类型和变量后页 退出前页
1,表达式表达式可以分为简单表达式、赋值表达式以及条件表达式三种,
简单表达式
赋值表达式
条件表达式
8.3.4 表达式与运算符
2,运算符运算符是指完成操作的一系列符号,在 JavaScript中有算术运算符,比较运算符,逻辑布尔运算符等,有些运算符还有双目运算符和单目运算符之分:
后页 退出前页
( 1) 算术运算符双目运算符,+(加),-(减),*(乘),/(除)、
%(取模),|(按位或),&(按位与 ),<<(左移)、
>>(右移),>>>(右移,零填充)
单目运算符,-(取反),~(取补),++(递加 1),-
-(递减 1)
( 2) 比较运算符
<(小于 ),>(大于 ),<=(小于等于 ),>=(大于等于 )、
==(等于 ),!=(不等于 )
( 3) 布尔逻辑运算符
!( 取反 ),&=( 与之后赋值 ),&( 逻辑与 ),|=( 或之后赋值 ),|( 逻辑或 ),^=( 异或之后赋值 ),^( 逻辑异或 ),?:( 三目操作符 ),||( 或 ),==(等于 )、
|=(不等于 )
后页 退出前页
8.3.5 程序的基本构成
JavaScript脚本语言的基本构成:程序控制语句、
函数、对象、方法、属性等::
8.3.5.1 程序控制语句
1,if条件语句
( 1) 基本格式
if( 表述式 )
语句段 1;
......
else
语句段 2;
后页 退出前页
( 2) if语句的嵌套
if( 布尔值 ) 语句 1;
else( 布尔值 ) 语句 2;
else if( 布尔值 ) 语句 3;
......
else 语句 4;
2,For循环语句基本格式,for( 初始化;条件;增量 )
语句集;
3,while循环基本格式,while( 条件 )
语句集;
后页 退出前页
4,break和 continue语句
8.3.5.2 函数
1,JavaScript 函数定义基本格式,Function 函数名 ( 参数,变元 ) {
函数体 ;
Return 表达式 ;
}
2,函数中的形式参数
Function function_Name(exp1,exp2,exp3,exp4)
后页 退出前页
8.3.5.3 事件驱动及事件处理
1、基本概念
2、事件处理程序
3、事件驱动
( 1)单击事件 onClick
( 2) onChange改变事件
( 3)选中事件 onSelect
( 4)获得焦点事件 onFocus
( 5)失去焦点 onBlur
( 6)载入文件 onLoad
( 7)卸载文件 onUnload
后页 退出前页
8.3.5.4 示例
test.htm
<HTML>
<HEAD>
<script Language="JavaScript">
<!--
function loadform(){
alert("这是一个自动装载例子 !");
}
function unloadform(){
alert("这是一个卸载例子 !");
}
后页 退出前页
//-->
</Script>
</HEAD>
<BODY OnLoad="loadform()" OnUnload="unloadform()">
<a href="test.htm">调用 </a>
</BODY>
</HTML>
总结,本章介绍的是有关网页制作的一些基本工具 FrontPage
和 DreamWeaver的使用方法,并介绍了动态网页制作中的编程语言 JavaScript和动态图像制作工具 Flash
8.2 Flash动画制作
8.2.1 Flash简介
Flash是 MACROMEDIA公司于 1999年 6月推出的优秀网页动画设计软件。 Flash是一种既简单直观又功能强大的动画设计工具,它具有以下特点:
1、使用矢量图形和流式播放技术
2、通过使用关键帧和图符使得所生成的动画 (.swf)
文件非常小
3、把音乐、动画、声效交互方式融合在一起后页 退出前页
4、强大的动画编辑功能使得设计者可以随心所欲地设计出高品质的动画,通过 ACTION和 FS COMMAND可以实现交互性,使 Flash具有更大的设计自由度总之,Flash已经慢慢成为网页动画的标准,
成为一种新兴的技术发展方向。
8.2.2 Flash中涉及的基本概念
(一)帧( frame)动画是由一幅幅变化连续的静态画面组成,每幅静态画面被称为一帧
(二)图层( Layer)形象地说,图层可以看成是叠放在一起的透明的胶片,图层是 Flash中最基本而且重要的内容,因而需要很好地掌握后页 退出前页
(三)事件( Events)事件是指 windows平台下发生的某种动作如:鼠标移动、键盘有按键等。事件也可以是用户自己定义的特定动作,这些特定动作是用户触发其它动作的引子
(四)动作 (Actions) 动作是指在事件发生后,将要对该事件进行处理的一系列动作的统称
(五)脚本( Score)脚本就是指每帧画面出现的时机及滞留时间的具体安排等信息
(六)电影发布( Pubishing)电影发布是指使用 Flash制作完成的动画经过打包生成独立的可以被网页调用的文件的这一过程后页 退出前页
8.2.3 Flash的制作要点
8.2.3.1 Flash工作环境
Flash的工作环境大致就包括这几个部分,以下分别作简要介绍:
后页 退出前页
( 1)舞台 (Stage),就是工作区,最主要的可编辑区域
( 2)时间轴窗口 (Timeline) 用它可以调整电影的播放速度
( 3)绘图工具栏 (Drawing Toolbar) 放置了可供图形和文本编辑的各种工具
( 4)标准工具栏 (Standard Toolbar) 列出了大部分最常用的操作,便于进行更为快捷的操作
( 5)图库窗口 (Library Window) 用以存放可以重复使用的称为符号的元素
( 6)控制器面板 (Controller) 控制电影的播放操作的工具集合
8.2.3.2 Flash的基本操作后页 退出前页
1、舞台的基本操作新增舞台窗口 自动排列多个舞台窗口改变舞台显示内容 改变舞台显示比例
2、时间线控制栏的基本操作移动动画播放指针 切换当前层切换当前帧 查看当前帧信息改变时间线控制栏 /窗口中帧的显示状态
3、场景的基本操作切换当前场景 新增加场景删除场景 移动场景列表中的顺序为当前场景更名 复制当前场景
4、设置舞台中作品的大小后页 退出前页
5、设置作品的的背景色
6、设置动画的播放速度
7、色彩的选择和操作
8,Flash的出版和预览动画出版的具体操作步骤如下:
( 1) 文件的出版设置后页 退出前页
( 2) 文件的出版预览
( 3) 文件的出版
8.2.3.3 Flash中 Actions(动作 )介绍
Go To(转到),默认是转到某一帧然后停止播放
Play (播放),开始播放已经停止了的动画后页 退出前页
Stop(停止):停止正在播放的动画
Toggle High Quality( 切换高质量画面 )
Stop All Sounds(停止所有声音 )
Get URL(获取 URL )
FS Command(发出 FS Command命令 )
Load/Unload Movie( 加载 /卸载动画 )
Tell Target(告知目标 )
If Frame Is Loaded(如果帧已被加载 )
On MouseEvent( 鼠标事件 )
If(如果 ) Loop( 循环 ) Call(调用)
Set Property(设置属性) Set Variable(设置变量)
Drag Movie Clip(拖动电影夹子)
后页 退出前页
8.2.3.4 Flash动画的制作流程一般 Flash动画制作分为以下几个阶段:
1,动画创意阶段
2,动画资源收集阶段
3,动画制作阶段
4,动画修改和发布阶段后页 退出前页
<OBJECT WIDTH="550" HEIGHT="400">
<PARAM NAME="MOVIE" VALUE="tutorial.swf">
<EMBED SRC="tutorial.swf,WIDTH="550" HEIGHT="400">
</EMBED>
</OBJECT>
8.2.3.5 将 Flash动画嵌入网页总结,Flash是一个优秀制作动画的可视化工具,只有通过多读 Flash动画实例,多动手制作 Flash
动画,才能熟练的掌握 Flash制作要领 。
后页 退出前页
8.3 JavaScript语言
8.3.1 JavaScript 语言简介
JavaScript是一种基于对象 (Object)和事件驱动
(Event Driven)并具有安全性能的脚本语言。 具有以下几个基本特点:
1、一种脚本编写语言
2、基于对象的语言
3、简单性
4、安全性
5、动态性
6、跨平台性
7、节省 CGI的交互时间后页 退出前页
8.3.2 JavaScript与 Java
JavaScript语言和 Java语言是相关的,但它们之间的联系并不像想象中的那样紧密,二者的区别体现在:
( 1)两个公司开发的不同的两个产品
( 2) JavaScript是基于对象,而 Java是面向对象
( 3)在其浏览器中所执行的方式不一样
( 4) 所采取的变量是不一样
( 5) 代码格式不一样
( 6) 嵌入方式不一样
( 7) 静态绑定和动态绑定后页 退出前页
JavaScript 只有唯一的变量定义方式,var
variablement。 变量定义的关键字是 var,变量名称是 variablement。 Javascript的变量名必须遵循以下命名规则:
大,小写英文字母和数字构成
变量名中只能包含下划线符号,不能包含其它符号
变量名区分大小写
变量名不允许是 JavaScript的保留字
变量命名最好把变量的意义与其代表的意思对应起来
JavaScript支持的数据类型:数字,字符串,布尔值
Null( 空值 ) 和对象
8.3.3 数据类型和变量后页 退出前页
1,表达式表达式可以分为简单表达式、赋值表达式以及条件表达式三种,
简单表达式
赋值表达式
条件表达式
8.3.4 表达式与运算符
2,运算符运算符是指完成操作的一系列符号,在 JavaScript中有算术运算符,比较运算符,逻辑布尔运算符等,有些运算符还有双目运算符和单目运算符之分:
后页 退出前页
( 1) 算术运算符双目运算符,+(加),-(减),*(乘),/(除)、
%(取模),|(按位或),&(按位与 ),<<(左移)、
>>(右移),>>>(右移,零填充)
单目运算符,-(取反),~(取补),++(递加 1),-
-(递减 1)
( 2) 比较运算符
<(小于 ),>(大于 ),<=(小于等于 ),>=(大于等于 )、
==(等于 ),!=(不等于 )
( 3) 布尔逻辑运算符
!( 取反 ),&=( 与之后赋值 ),&( 逻辑与 ),|=( 或之后赋值 ),|( 逻辑或 ),^=( 异或之后赋值 ),^( 逻辑异或 ),?:( 三目操作符 ),||( 或 ),==(等于 )、
|=(不等于 )
后页 退出前页
8.3.5 程序的基本构成
JavaScript脚本语言的基本构成:程序控制语句、
函数、对象、方法、属性等::
8.3.5.1 程序控制语句
1,if条件语句
( 1) 基本格式
if( 表述式 )
语句段 1;
......
else
语句段 2;
后页 退出前页
( 2) if语句的嵌套
if( 布尔值 ) 语句 1;
else( 布尔值 ) 语句 2;
else if( 布尔值 ) 语句 3;
......
else 语句 4;
2,For循环语句基本格式,for( 初始化;条件;增量 )
语句集;
3,while循环基本格式,while( 条件 )
语句集;
后页 退出前页
4,break和 continue语句
8.3.5.2 函数
1,JavaScript 函数定义基本格式,Function 函数名 ( 参数,变元 ) {
函数体 ;
Return 表达式 ;
}
2,函数中的形式参数
Function function_Name(exp1,exp2,exp3,exp4)
后页 退出前页
8.3.5.3 事件驱动及事件处理
1、基本概念
2、事件处理程序
3、事件驱动
( 1)单击事件 onClick
( 2) onChange改变事件
( 3)选中事件 onSelect
( 4)获得焦点事件 onFocus
( 5)失去焦点 onBlur
( 6)载入文件 onLoad
( 7)卸载文件 onUnload
后页 退出前页
8.3.5.4 示例
test.htm
<HTML>
<HEAD>
<script Language="JavaScript">
<!--
function loadform(){
alert("这是一个自动装载例子 !");
}
function unloadform(){
alert("这是一个卸载例子 !");
}
后页 退出前页
//-->
</Script>
</HEAD>
<BODY OnLoad="loadform()" OnUnload="unloadform()">
<a href="test.htm">调用 </a>
</BODY>
</HTML>
总结,本章介绍的是有关网页制作的一些基本工具 FrontPage
和 DreamWeaver的使用方法,并介绍了动态网页制作中的编程语言 JavaScript和动态图像制作工具 Flash