jquery轮播图小结

jquery轮播图有很多，这个是类似淘宝、京东首页轮播图的一种

第一步，下载文件jquery-1.5.2.js、jquery.smallslider.js 、smallslider.css

第二步，准备几个需要显示的图片

第三步，新建jsp页面

js代码块：

$(document).ready(function(){
  $('#exp1').smallslider({
   onImageStop:false,
   switchEffect:'ease'
  });
     });

html代码块：

 <div id="exp1" class="exmp smallslider">
  <ul>
        <li><a href="/common/images/001.jpg"><img src="/common/images/1.jpg" title=""/></a></li>
        <li><a href="/common/images/002.jpg"><img src="/common/images/2.jpg" title=""/></a></li>
        <li><a href="/common/images/003.jpg"><img src="/common/images/3.jpg" title=""/></a></li>
        <li><a href="/common/images/004.jpg"><img src="/common/images/4.jpg" title=""/></a></li>
        <li><a href="/common/images/005.jpg"><img src="/common/images/5.jpg" title=""/></a></li>
        <li><a href="/common/images/003.jpg"><img src="/common/images/3.jpg" title=""/></a></li>
        <li><a href="/common/images/004.jpg"><img src="/common/images/4.jpg" title=""/></a></li>
        <li><a href="/common/images/005.jpg"><img src="/common/images/5.jpg" title=""/></a></li> 
  </ul>
 </div>

第四步，部署project，启动。访问该页面