jq幻灯片2

JS代码：
 $(function(){
  $('#slides').slides({
   preload: true,
   preloadImage: 'img/loading.gif',
   play: 5000,
   pause: 2500,
   hoverPause: true
  });
 });

CSS样式：

html, body, div,img, ol, ul, li { margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }
ol, ul { list-style:none; }
#container { width:850px; margin:0 auto; position:relative; z-index:0; }
#slides { position:absolute; top:15px; left:4px; z-index:100; }
#slides .next, #slides .prev {width:24px; height:43px;position:absolute;top:107px;left:-24px;display:block;z-index:101;background:url(img/arrow-prev.png);cursor:pointer;}
#slides .next {left:800px;background:url(img/arrow-next.png); }
.slides_container { width:800px; height:240px; overflow:hidden; position:relative; margin:0 auto;}
.pagination { margin:10px auto 0; width:100px; }
.pagination li { float:left; margin:0 1px; }
.pagination li a { display:block; width:12px; height:0; padding-top:12px; background-image:url(img/pagination.png); background-position:0 0; float:left; overflow:hidden; }
.pagination li.current a { background-position:0 -12px; }

html代码：

<div id="container">	
<div id="slides">
<div class="prev"></div>
    <div class="slides_container">
    <a href=""  target="_blank"><img src="img/hot_ad01.jpg"></a>
    <a href=""  target="_blank"><img src="img/hot_ad02.jpg"></a>
    <a href=""  target="_blank"><img src="img/hot_ad01.jpg"></a>
    <a href=""  target="_blank"><img src="img/hot_ad02.jpg"></a>
    </div>
    <div class="next"></div>
  </div>
 </div>