JavaScript+jQuery网页特效设计任务驱动教程 单元4 设计图片类网页.pptxVIP

网页特效设计任务驱动教程;单元?4 设计图片类网页特效?;图4-1 JavaScript实现的纵向焦点图片轮换效果; ; 在网页0401.html中实现纵向焦点图片轮换效果的主要对应的CSS代码如表4-2所示。 ; 在网页0401.html中实现纵向焦点图片轮换效果对应的JavaScript代码如表4-3所示。 其设计思路如下。 （1）网页内容由document对象的write()方法输出。 （2）网页加载完成时触发onload事件，执行playit()函数，每隔2500 ms调用一次playnext()函数。 （3）playnext()函数分别设置当前显示图片的序号值、调用函数setfoc()以及playnext()函数自身。 （4）函数setfoc()主要实现图片切换和图片滤镜效果。 ;序号;序号;序号;任务4-2 jQuery实现带左右按钮控制焦点图片切换 网页0402.html中带左右按钮控制焦点图片切换的外观效果如图4-2所示。 网页0402.html中带左右按钮控制焦点图片切换对应的HTML代码如表4-4所示。 ;序号; 网页0402.html中主要应用的CSS代码如表4-5所示。 ;序号; jQuery实现的带左右按钮控制焦点图片切换对应的JavaScript代码如表4-6所