自适应全屏轮播图JS资源-CSDN文库

共14个文件

jpg：6个

png：2个

js：2个

JS,轮播图

4星 · 超过85%的资源需积分: 50 98 浏览量 2015-12-03 16:37:02 上传评论 1 收藏 532KB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

autoFocus.rar （14个子文件）

autoFocus

css

style.css 4KB

images

3-31.jpg 242KB

bullets.png 1KB

bodyBg.jpg 307B

bodyBg2.jpg 306B

banner2.jpg 180KB

bodyBg3.jpg 307B

prev_next.png 4KB

banner1.jpg 79KB

index.html 4KB

mobilyslider.js 4KB

jquery-1.8.3.min.js 110KB

科e互联.url 3KB

readme.html 4KB

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"> <title>jQuery响应式自适应宽屏焦点图特效 - 【科e互联】</title> <link href="css/style.css" rel="stylesheet" type="text/css"> <script src="js/jquery-1.8.3.min.js" type="text/javascript"></script> <script src="js/mobilyslider.js" type="text/javascript"></script> <script> $(document).ready(function(){ $('.slider').mobilyslider({ content:'.sliderContent', children:'div', transition:'horizontal', animationSpeed:200, autoplay: true, autoplaySpeed:3000, pauseOnHover:true, bullets:true, arrows:true, arrowsHide:true, prev:'prev', next:'next', animationStart: function(){}, animationComplete: function(){} }); }); </script>  </head> <body class="keBody"> <h1 class="keTitle">jQuery响应式自适应宽屏焦点图特效</h1> <div class="kePublic">  <div class="banner"> <div class="slider"> <div class="sliderContent"> <div class="item" style="background-color: rgb(11, 183, 207); z-index: 2; background-position: initial initial; background-repeat: initial initial;"> <a href="http://www.internetke.com" hidefocus="true" style="outline: none;"> <img src="images/banner1.jpg" alt=""> </a> </div> <div class="item" style="background-color: rgb(255, 102, 0); z-index: 1; background-position: initial initial; background-repeat: initial initial;"> <a href="http://www.internetke.com" hidefocus="true" style="outline: none;"> <img src="images/banner2.jpg" alt=""> </a> </div> <div class="item" style="background-color:rgb(66, 143, 9);z-index:0;background-position:initial initial;background-repeat: initial initial;"> <a href="http://www.internetke.com" hidefocus="true" style="outline: none;"> <img src="images/3-31.jpg" alt=""> </a> </div> </div>  <div class="sliderArrows" style="display:none;"> <a href="http://www.internetke.com/" class="prev png_bg" hidefocus="true" style="outline:none;">Previous</a> <a href="http://www.internetke.com/" class="next png_bg" hidefocus="true" style="outline: none;">Next</a> </div> </div> </div>  <div class="clear"></div> </div> <div class="keBottom"> <p class="keTxtP">科e互联网页特效集锦---更多特效请访问 <a class="keUrl" href="http://www.internetke.com" target="_blank">www.internetke.com</a></p> <p class="keTxtP">本站导航： <a href="http://www.internetke.com/" target="_blank" class="cor_bs">网站建设</a> | <a href="http://www.internetke.com/material/" target="_blank" class="cor_bs">网页素材</a> | <a href="http://www.internetke.com/effects/" target="_blank" class="cor_bs">网页特效</a> | <a href="http://www.internetke.com/share/" target="_blank" class="cor_bs">设计分享</a> | <a href="http://www.internetke.com/tutorial/" target="_blank" class="cor_bs">建站教程</a> | <a href="http://www.internetke.com/model/" target="_blank" class="cor_bs">网站模版</a> | <a href="http://www.internetke.com/appreciate/" target="_blank" class="cor_bs">酷站赏析</a> </p> <p class="keTxtP">＊尊重他人劳动成果，转载请自觉注明出处！注：此代码为【科e整理/原创特效】仅供学习交流，请勿用于商业用途。 <a target="_blank" href="http://wp.qq.com/wpa/qunwpa?idkey=a7df3558c291e0407375b9ad649d96a6e507286ffeb0650c65a221d1500a0779" class="button red" title="北京网站建设,网页特效QQ交流群-科e互联">加入QQ交流群</a></p> </div> </body> </html>

评论收藏

内容反馈