jQuery两组图片滑块展示.zip资源-CSDN文库

共29个文件

png：11个

jpg：6个

css：5个

版权申诉

javascript

html5

jQuery

33 浏览量 2022-11-21 11:32:25 上传评论收藏 299KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

jQuery两组图片滑块展示.zip （29个子文件）

jQuery两组图片滑块展示

jQuery两组图片滑块展示.jpg 30KB

jiaoben1383

css

lush.min.css 46KB

lush.animations.css 30KB

img

shadow-d.png 7KB

shadow-b.png 2KB

shadow-a.png 4KB

shadow-c.png 5KB

skin

lush-mini-skin-dark.png 1KB

lush-mini-skin-silver.png 1KB

lush-skin-dark.png 2KB

lush-mini-skin.png 2KB

lush-skin.png 3KB

Thumbs.db 17KB

lush-skin-flat.png 2KB

lush-skin-silver.png 2KB

index.html 4KB

jquery.lush.js 20KB

jquery.easing.1.3.min.js 4KB

carousel

carousel1.jpg 30KB

carousel4.jpg 50KB

carousel3.jpg 27KB

carousel5.jpg 46KB

Thumbs.db 18KB

carousel2.jpg 26KB

demo

assets

css

bootstrap.min.css 151KB

bootstrap-responsive.css 17KB

style.css 5KB

jquery.js 90KB

bootstrap.min.js 28KB

<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>jQuery两组图片滑块展示 - 网页模板</title> <meta name="viewport" content="width=device-width, initial-scale=1.0">  <link href="demo/assets/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="demo/assets/css/style.css" /> <link rel="stylesheet" href="css/lush.animations.css" /> <link rel="stylesheet" href="css/lush.min.css" /> <link href="demo/assets/css/bootstrap-responsive.css" rel="stylesheet"> <style> #carousel-1 img { border: 1px solid rgba(0, 0, 0, 0.2); } </style>   <script src="ga.js"></script> </head> <body> <div class="container"> <div class="masthead"> <h2 class="muted"></h2> </div> <ul class="lush-slider flat no-shadow" style="max-width: 700px" id="carousel-1" data-base-width="1100" data-base-height="220"> <li data-slide-in="at 0 from back use easeOutExpo during 1000" data-slide-out="at 100 to bottom use easeInExpo during 500"> <img src="carousel/carousel1.jpg" class="img-polaroid" style="top: 38px; left: 224px; " /> <img src="carousel/carousel2.jpg" class="img-polaroid" style="top: 38px; left: 448px; " /> <img src="carousel/carousel3.jpg" class="img-polaroid" style="top: 38px; left: 672px; " /> </li> <li data-slide-in="at 0 from back use easeOutExpo during 1000" data-slide-out="at 100 to bottom use easeInExpo during 500"> <img src="carousel/carousel4.jpg" class="img-polaroid" style="top: 38px; left: 224px; " /> <img src="carousel/carousel2.jpg" class="img-polaroid" style="top: 38px; left: 448px; " /> <img src="carousel/carousel5.jpg" class="img-polaroid" style="top: 38px; left: 672px; " /> </li> </ul> <hr> <ul class="lush-slider flat dark no-shadow" style="max-width: 700px" id="carousel-2" data-base-width="1100" data-base-height="220"> <li data-slide-in="plus 100 from right use easeOutExpo during 1000" data-slide-out="plus 100 to left use easeInExpo during 500"> <img src="carousel/carousel1.jpg" class="img-polaroid" style="top: 38px; left: 224px; " /> <img src="carousel/carousel2.jpg" class="img-polaroid" style="top: 38px; left: 448px; " /> <img src="carousel/carousel3.jpg" class="img-polaroid" style="top: 38px; left: 672px; " /> </li> <li data-slide-in="plus 100 from right use easeOutExpo during 1000" data-slide-out="plus 100 to left use easeInExpo during 500"> <img src="carousel/carousel4.jpg" class="img-polaroid" style="top: 38px; left: 224px; " /> <img src="carousel/carousel2.jpg" class="img-polaroid" style="top: 38px; left: 448px; " /> <img src="carousel/carousel5.jpg" class="img-polaroid" style="top: 38px; left: 672px; " /> </li> </ul> <div id="feat"></div> </div>    <script src="demo/assets/js/jquery.js"></script> <script src="demo/assets/js/bootstrap.min.js"></script> <script src="js/jquery.easing.1.3.min.js"></script> <script src="js/jquery.lush.js"></script> <script> $(function(){ $('#feat').load('features.html') $('#carousel-1, #carousel-2').lush({ manual: true, slider: { pauseOnHover: true, keyboard: false, pager: false, carousel: true } }) }) </script> <div style="text-align:center;clear:both"> <p>适用浏览器：FireFox、Chrome、Safari、Opera、傲游、搜狗. 不支持IE8、360、世界之窗。</p> <p>来源：<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p> </div> </body> </html>

评论收藏

内容反馈

版权申诉