实验内容１、利用 JavaScript 制作文字颜色变换特效２、利用 JavaScript 制作网页背景颜色变换特效３、利用 JavaScript 制作图片淡入淡出特效

实验内容 １、利用JavaScript制作文字颜色变换特效２、利用JavaScript制作网页背景颜色变换特效３、利用JavaScript制作图片淡入淡出特效４、利用JavaScript制作文字跟随鼠标特效

实验目的 1、理解JavaScript语言的交互性和动态性 2、掌握如何利用JavaScript语言制作网页特效

实验重点 1、掌握在网页中插入JavaScript代码的方法 2、利用JavaScript实现网页动态效果

实验难点 1、网页中特殊效果的实现方法

实验内容一：用JavaScript制作文字颜色变换特效实验内容一：用JavaScript制作文字颜色变换特效步骤1：准备JavaScript代码步骤2：编辑要实现特效的网页源代码步骤3：将JavaScript代码插入到网页源代码中的适当位置步骤4：浏览实现文字颜色变换特效的网页步骤5：增加文字颜色种类（turquoise,coral,orange,lime,violet）步骤6：随机显示文字颜色（Math.round(Math.random()*10)）步骤7：增加文字的跑马灯效果

实验内容二：用JavaScript制作网页背景颜色变换特效 步骤1：准备JavaScript代码步骤2：编辑要实现特效的网页源代码步骤3：将JavaScript代码插入到网页源代码中的适当位置步骤4：在<body>标签中加入onload事件步骤5：浏览实现背景色变换特效的网页步骤6：控制背景颜色变换速度步骤7：随机显示背景颜色

实验内容三：用JavaScript制作图片淡入淡出特效实验内容三：用JavaScript制作图片淡入淡出特效步骤1：准备JavaScript代码步骤2：编辑要实现特效的网页源代码步骤3：将JavaScript代码插入到网页源代码中的适当位置步骤4：在<image>标签中加入alpha滤镜步骤5：在<body>标签中加入onload事件步骤6：控制图片透明度直到完全消失步骤7：当鼠标移动到图片上方时，启动图片淡入淡出特效

实验内容四：用JavaScript制作文字跟随鼠标特效实验内容四：用JavaScript制作文字跟随鼠标特效步骤1：准备JavaScript代码步骤2：编辑要实现特效的网页源代码步骤3：将部分JavaScript代码插入到网页<head></head>之间步骤4：其余部分插入到网页<body></body>之间步骤5：在<body>标签中加入onload事件步骤6：控制跟随鼠标的文字大小和颜色步骤7：控制跟随鼠标的文字间距

思考题：用JavaScript制作彩蛋跟随鼠标特效 提示： 1、可参考文字跟随鼠标特效 2、跟随鼠标的彩蛋可用图片来实现（egg1-3.gif） 3、同学们可分组讨论，发挥团队力量 4、教师对每个小组进行考核，记录实验课考核成绩

【实验小结】 通过这次实验课的学习，同学们理解了JavaScript语言的交互性和动态性，掌握了如何利用JavaScript制作网页特效，使我们制作的网页“动”静结合，“变”化莫测。

谢谢！

实验内容１、利用 JavaScript 制作文字颜色变换特效２、利用 JavaScript 制作网页背景颜色变换特效３、利用 JavaScript 制作图片淡入淡出特效