基于jquery的简单轮播效果
- 无缝轮播、前进后退、指示器(分页器)
- 使用时注意设置组外层宽高
html代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="index.css" />
<script src="jquery-1.11.0.js"></script>
<script src="index.js"></script>
<style>
/* 使用此代码,需要手动设置最外层的大小 */
.swiper {
width: 1000px;
height: 300px;
}
</style>
</head>
<body>
<div class="swiper">
<!--轮播图-->
<ul class="inner clearfix">
<li><img src="images/1.jpg" alt="" /></li>
<li><img src="images/2.jpg" alt="" /></li>