html：

<div class="imgBox">
  <ul>
    <li class="item">
      <a href="#"><img src="images/mobile/pic.png" alt="" class="lunbo"></a> 
    </li>
    <li class="item">
      <a href="#"><img src="images/mobile/pic1.png" alt="" class="lunbo"></a>
    </li>
  </ul>
</div>

css：

.imgBox img{
  width: 4.375rem;
  height: 2.8625rem;
}
.item{
  display: none;
  width: 100%;
  height: 2.8625rem;
  position: absolute;
  bottom: 0.125rem;
  left: 3%;
}
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
ul li:first-child{
  display: block;
}
.lunbo {
  width: 100%;
  height: 2.8625rem;
}

js：

// 巡护图片
(function(){
    var index2 = 0;/*初始化一个变量 指向下彪*/
    var time2 = setInterval(function () {
        index2++;
        if (index2 > 4) { index2 = 0; }
        $(".item").eq(index2).fadeIn().siblings().fadeOut();
        $(".tab-btn .btn").eq(index2).addClass("active").siblings().removeClass("active");
    }, 2000); //定时器 重复
})();

     希望我的愚见能够帮助你哦~，若有不足之处，还望指出，你们有更好的解决方法，欢迎大家在评论区下方留言支持，大家一起相互学习参考呀~