个回答

• LANXUE1997

  2018-01-06 22:23:17

  <!--

                   &lt:HTML字符转义，代表"<"

                   &gt:HTML字符转义，代表">"

  -->

  <a href="javascript:;" id="prev" class="arrow">&lt;</a>

  <a href="javascript:;" id="next" class="arrow">&gt;</a>

  
  

  css部分：

  .arrow{

  width: 30px;

  height: 30px;

  background-color: rgba(0,0,0,0.3);

  cursor: pointer;

  /*opacity: 0.6;*/

  color: #FFFFFF;

  text-align: center;

  line-height: 30px;

  font-size: 16px;

  }

  #prev{

  position: absolute;

  top: 40%;

  left:5px;

  }

  #next{

  position: absolute;

  top: 40%;

  right:5px;

  }

  js部分：

  var prev=document.getElementById("prev");

  var next=document.getElementById("next");

  prev.onclick=function(){

  index--;

  if(index<0){

  index=4;

  }

          change(index);

          if(timer){

          clearInterval(timer);

          timer=null;

          }

          timer=setInterval(autoPlay,2000);

  }

  next.onclick=function(){

  index++;

  if(index>4){

  index=0;

  }

  change(index);

  if(timer){

          clearInterval(timer);

          timer=null;

          }

          timer=setInterval(autoPlay,2000);

  }

  
  

  1