Html
    Css
    Js

    
                        
#banner
{
  width:560px;
  height:300px;
  margin:20px auto; 
  position:relative;
}

#left
{
  width:61px;
  height:61px;
  position:absolute;
  background:url(http://www.jq22.com/demo/jqueryBanner20170111/img/left-1.png) no-repeat center center;
  left:-60px;
  top:42%;
  display:inline-block;
}

#right
{
  width:61px;
  height:61px;
  position:absolute;
  background:url(http://www.jq22.com/demo/jqueryBanner20170111/img/right-1.png) no-repeat center center;
  right:-60px;
  top:42%;
  display:inline-block;
}
 
.pic 
{
  width:560px;
  height:300px;    
}

.pic img
{
  display:none;
  position:absolute;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:2.1.4
 立即下载

用jquery写轮播图

0