你的位置:首页 > 软件开发 > 网页设计 > 一个酷炫的,基于HTML5,Jquery和Css的全屏焦点图特效,兼容各种浏览器

一个酷炫的,基于HTML5,Jquery和Css的全屏焦点图特效,兼容各种浏览器

发布时间:2015-03-21 16:00:23
基于HTML5和CSS的焦点图特效,梅花图案的背景很有中国特色,而且还会动哦,效果超炫,推荐下载!演示图html代码 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

 基于HTML5和CSS的焦点图特效,梅花图案的背景很有中国特色,而且还会动哦,效果超炫,推荐下载!

演示图

一个酷炫的,基于HTML5,Jquery和Css的全屏焦点图特效,兼容各种浏览器

html代码

 
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html ="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 5 <meta name="keywords" content="一个酷炫的,基于HTML5和Css的焦点图特效,兼容各种浏览器" /> 6 <meta name="description" content="一个酷炫的,基于HTML5和Css的焦点图特效,兼容各种浏览器" /> 7 <title>一个酷炫的,基于HTML5和Css的焦点图特效,兼容各种浏览器</title> 8 <link href="css/slider.css" rel="stylesheet" type="text/css" /> 9 <!--[if lt IE 9]><script src='/images/loading.gif' data-original="js/html5.js"></script><![endif]-->10 <!--[if IE 6]> 11 <script type="text/javascript" src='/images/loading.gif' data-original="js/DD_belatedPNG.js"></script> 12 <script>DD_belatedPNG.fix('*');</script> 13 <![endif]-->14 <script type='text/javascript' src='/images/loading.gif' data-original='js/jquery-1.7.2.min.js'></script>15 <script type='text/javascript' src='/images/loading.gif' data-original='js/common.js'></script>16 <script type='text/javascript' src='/images/loading.gif' data-original='js/slider.js'></script>17 </head>18 <body>19 <header>20  <div class="header-content home">21   <div class="parallax-bg" id="slider-wrap">22    <div class="slider parallax-bg" id="slider">23     <div class="slider-sections sandbox">24      <section class="first"> <img  src='/images/loading.gif' data-original="images/home-banner-1.png"/>25       <div class="text">26        <h2>SmartSite Ver 2.2<br />27         智能网站管理系统 </h2>28        <p class="copy">采用前后台完全分离技术,通过标签(支持标签循环嵌套、判断标签、自定义标签、文件循环嵌套等)加模板技术.全站生成纯静态页。</p>29        <p class="button"><a href="http://www.cnblogs.com/">Download</a> <a class="dimmed" href="http://www.cnblogs.com/">Learn More</a></p>30       </div>31      </section>32      <section> <img src='/images/loading.gif' data-original="images/dataviz-home-image-q2.png"  />33       <div class="text" style="padding-top: 10px;">34        <h2>企业网站管理系统</h2>35        <p class="copy">单页面、单页面索引、新闻、产品展示、下载、友情链接、网上商城,在线支付、配送、支付方式管理、广告等模块。</p>36        <p class="button"><a href="http://www.cnblogs.com/">Download</a> <a class="dimmed" href="http://www.cnblogs.com/">Learn More</a></p>37       </div>38      </section>39      <section> <img src='/images/loading.gif' data-original="images/home_banner_web-q2.png"  />40       <div class="text">41        <h2>智能移动网站管理系统</h2>42        <p class="copy">基于jquery.Mobile、HTML5技术框架,前后台完全分离,采用标签加模板技术,全站生成纯静态页。</p>43        <p class="button"><a href="http://www.cnblogs.com/" >Download</a> <a class="dimmed" href="http://www.cnblogs.com/">Learn More</a></p>44       </div>45      </section>46     </div>47    </div>48    <a class="slider-prev" href="javascript: void(0)">&lt;</a> <a class="slider-next" href="javascript: void(0)">&gt;</a> </div>49  </div>50 </header>51 </body>52 </html>

原标题:一个酷炫的,基于HTML5,Jquery和Css的全屏焦点图特效,兼容各种浏览器

关键词:HTML

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。