PHP+CMS+Dreamweaver网站设计实例教程王德永张少龙第5章教育网站添加网页特效课件教学.pptVIP

* * * 下面的函数会返回两个数相乘的值（a 和 b）： function prod(a,b){ x=a*b return x} 当调用上面这个函数时，必须传入两个参数： product=prod(2,3)而从 prod() 函数的返回值是 6，这个值会存储在名为 product 的变量中。 （6）JavaScript 循环 在编写代码时，你常常希望反复执行同一段代码。我们可以使用循环来完成这个功能，这样就用不着重复地写若干行相同的代码。 JavaScript 有三种循环，for循环、while循环和do while循环。在脚本的运行次数已确定的情况下使用 for 循环较为合适。当循环采用条件控制时，建议使用while循环或do while循环，当指定的条件为 true 时循环执行循环代码。 ①for 循环结构 语法： for (变量=开始值;变量=结束值;变量=变量+步进值) { 需执行的代码} ②while 循环结构 while 循环用于在指定条件为 true 时循环执行循环代码。 语法： while (变量=结束值) { 需执行的代码 } 除了使用“=”，还可以使用其他的比较运算符。 ③do...while 循环 do...while 循环是 while 循环的变种。该循环程序在初次运行时会首先执行一遍其中的代码，然后当指定的条件为 true 时，它会继续这个循环。所以可以这么说，do...while 循环为执行至少一遍其中的代码，即使条件为 false，因为其中的代码执行后才会进行条件验证。 语法： do{ 需执行的代码 } while (变量=结束值) 1、添加教育网站特效 在这个网站中需要添加三个地方的JS特效，分别是滑动门特效、图片轮显特效、图片滚动特效。 （1）、滑动门特效：如图5-43 滑动门特效 图5-43 滑动门特效 （2）、图片轮显特效 图怎显示如图5-44所示： 图5-44 图片轮显特效 （3）图片滚动特效 图片连续滚动，具体效果如图5-45所示： 图5-45 图片滚动特效 本任务的考核是通过平顶山韩创教育咨询网站的特效完成情况为最终考核，考核的主要内容是JavaScript基本知识的掌握及使用JavaScript方法完成对页面的特效添加。表5-11为本任务考核标准。 表5-11 本任务考核标准 本次任务完成了韩创教育咨询网站的特效添加。通过对教育网站实例特效添加，使开发人员了解到JavaScript是Web开发中的一种脚本编程语言，也是一种通用的、跨平台的、基于对象和事件驱动并具有安全性的脚本语言。它不需要进行编译，而是直接嵌入在HTML页面中，把静态页面转变成支持用户交互并响应相应事件的动态页面。利用本任务所学知识与DIV+CSS相结合，使韩创教育咨询网站的页面更具有时代气息。 5.4.1 任务描述 5.4.2 实训目的 5.4.3 实训任务 5.4.4 实训考核 利用DIV+CSS样式表及JavaScrip脚本完成对 “平顶山华通胶辊有限公司”企业网站网页的布及网页特效的添加。 通过平顶山华通胶辊有限公司企业网站的制作，进一步强化对CSS样式制作及引用，同时强化使用DIV+CSS对页面进行布局，采用JavaScript来完成网站特效的处理，通过完善这些方面的操作，达到网站设计商业化标准，符合商业化要求。 本实训的任务包括如下三个： 1、使用DIV对模板页面进行合理分块，要求分块的宗旨是方便页面布局和调用。 2、在进行CSS样式设计的时候要尽可能满足DIV分块的要求，以达到页面显业效果符合企业网站的要求。 3、合理使用JavaScript等脚本语言，满足企业网站动态效果的需求。 完成后的效果图如5-46、图5-47和图5-48所示。 本实训的考核是通过平顶山华通胶辊有限公司网站的页面效果完成结果为最终考核。表5-12为本任务考核标准。 表5-12 本实训考核标准 在线教务辅导网： 更多课程配套课件资源请访问在线教务辅导网 馋死 PPT研究院 POWERPOINT ACADEMY 图5-24 导入式样式使用效果 结合上面介绍的CSS样式设计的知识对平顶山韩创教育咨询网站的CSS样式进行设计。本次任务的实施先从页面body开始，把主要CSS进行详细介绍。所有样式文件的实例源文件位于本书素材文件中的“第五章源码\index.css”。 1、body的样式设计 在这里使用了标记选择器来对整个body进行控制的。对于页面body的CSS样式设计主要考虑字体、字号、补丁、定位、颜色等几个方面进行设计。 body{ width:100%; /*宽度*/ font-family:宋体; /*