<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery自适应窗口大小图片轮播特效</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div id="slider">
<ul class="slides clearfix">
<li><img class="responsive" src="img/1.jpg"></li>
<li><img class="responsive" src="img/2.jpg"></li>
<li><img class="responsive" src="img/3.jpg"></li>
<li><img class="responsive" src="img/4.jpg"></li>
</ul>
<ul class="controls">
<li><img src="img/prev.png" alt="previous"></li>
<li><img src="img/next.png" alt="next"></li>
</ul>
<ul class="pagination">
<li class="active"></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
<script src="dist/easySlider.js"></script>
<script type="text/javascript">
$(function() {
$("#slider").easySlider( {
slideSpeed: 500,
paginationSpacing: "15px",
paginationDiameter: "12px",
paginationPositionFromBottom: "20px",
slidesClass: ".slides",
controlsClass: ".controls",
paginationClass: ".pagination"
});
});
</script>
</body>
</html>
jQuery自适应窗口大小图片轮播特效.zip
版权申诉
98 浏览量
2023-09-25
13:46:08
上传
评论
收藏 255KB ZIP 举报
jQuery自适应窗口大小图片轮播特效.zip （16个子文件） 
js 
jquery-2.1.1.min.js 82KB dist jquery.boilerplate.js 8KB easySlider.js 8KB jquery.boilerplate.min.js 4KB easySlider.min.js 5KB img 
2.jpg 42KB
prev.png 1KB 1.jpg 62KB next.png 1KB 3.jpg 56KB 4.jpg 53KB css style.css 597B normalize.css 2KB reset.css 1KB htmleaf-demo.css 6KB
index.html 1KB资源评论
