武林网(www.vevb.com)文章简介：这个页面用到了html5的标签元素和css3的线性渐变、圆角、阴影效果，以及当前流行的parallax视差特效和一些其他结合jquery的动画，在chrome,Safari,opera,firefox下都可以完美显示，如果你还使用IE浏览器，我想效果支持的并不是那么完美，不过尽管这样，我还是对IE6,7,8
这个页面用到了html5的标签元素和css3的线性渐变、圆角、阴影效果，以及当前流行的parallax视差特效和一些其他结合jquery的动画，在chrome,Safari,opera,firefox下都可以完美显示，如果你还使用IE浏览器，我想效果支持的并不是那么完美，不过尽管这样，我还是对IE6,7,8做了兼容性处理。
View Demo ,
Download
下面我们就来一步一步的实现这个页面，首先你要准备好设计师设计的PSD文件，并进行精确的切图，我们先来看这个comingsoon页面有哪些文件：
一个index.htm文件
css：
reset.css（格式化样式表）
style.css （网站主要样式表文件）
js：
jquery.jparallax.js支持该页面的视差效果的插件，需要与jquery1.2.6相配套使用，如需更多了解请前往 。
jquery.backgroundpos.js jquery的一个背景位置转换插件，用来支持该页面社会分享图标的动画效果。
CheckBrowser.js判断浏览器版本以及客户端设备的文件，用来调试兼容性。
Html5Act-Install.js 加载或启动动画的基础的js文件
image文件夹：包含所有的图片
字体：
我们的设计师设计了手绘字体，为了能让没有安装该字体的用户看到，我们引入了谷歌的字体库并在CSS样式中调用了它。
<link href=’?family=Francois+One|McLaren|Rye|Dancing+Script’ rel=’stylesheet’ type=’text/css’>
头部
我们使用了html5标签<header></header>,对于不支持html5标签的IE浏览器，我们这里通过调用谷歌的html5.js使其支持html5的标签，另外需要在CSS中声明这些元素块状显示，reset.css文件里面已经声明。在index.htm文件<head></head>部分你可以看到这部分代码：
<!–IE fix for HTML5 tags–>
< !–[if lt IE 9]>
< script src=””>
< /script>
< ![endif]–>
我们来看代码部分：
<header><img src=”image/logo.png” //Png transparent background in ie6var ua = checkB();if (ua["isIE6"]) {$("img,#left-box,#star,#brand,#sharebox,#sharebox ul li,#sharebox ul li a").addClass("png_bg");}
新闻热点
疑难解答
