图片轮播

/*轮播样式*/
#show {   position: relative; height: 409px; width: 100%;  margin: 0 auto;}
#show .img {position: absolute;height: 401px;width: 100%;overflow: hidden;  }
#show a {          float: left;          display: inline;      }
#show .img SPAN {          position: absolute;          width: 19999px;          display: block;          height: 409px;      }
#show .btns {          z-index: 10;          position: absolute;      }
#show .btns B {          position: absolute;          display: inline-block;          overflow: hidden;          top: 361px;          left: 1080px;          background: url("http://i0.jrjimg.cn/bxcsv2016/cur-bac.png") no-repeat;          height: 24px;          width: 158px;          padding-left: 26px;      }
#show .btns B I {          float: left;          font-size: 0px;          cursor: pointer;          margin-right: 10px;          background: url("http://i0.jrjimg.cn/bxcsv2016/no-cur.png") no-repeat;          width: 14px;          height: 14px;          display: inline-block;          margin-top: 5px;      }
#show .btns B I.on {          background: url("http://i0.jrjimg.cn/bxcsv2016/cur.png") no-repeat;          cursor: default;          width: 14px;          height: 14px;          display: inline-block;      }

HTML：
 
<div id="show" rel="autoPlay">
        <div class="img">
             <span style="left: -7612px;">
  <a href="#" target="_blank" style="height: 409px; width: 613px; background: url(image/fdj.png) 50% 0% no-repeat;"></a>
  <a href="#" target="_blank" style="height: 409px; width: 613px; background: url(image/yj.png) 50% 0% no-repeat;"></a>
  <a href="#" target="_blank" style="height: 409px; width: 613px; background: url(image/fdj.png) 50% 0% no-repeat;"></a>
  <a href="#" target="_blank" style="height: 409px; width: 613px; background: url(image/yj.png) 50% 0% no-repeat;"></a>
    </span>
        </div>

</div>

还需要引用js： <script src="js/slide.js"></script> 已经放到资源中

样式结果：