SOURCE

let $buttons = $('#buttonWrapper>button');
let $slides = $('#slides');
let $images = $slides.children('img');
let current = 0;
makeFakeSlides();

$slides.css({
  transform: 'translatex(-400px)'
});
bindEvents()
function bindEvents(){
  $('#buttonWrapper').on('click','button',function(e){
    let $button = $(e.currentTarget)
    let index = $button.index()
    $slides.css({transform: 'translatex('+(-(index+1)*400)+' px)'});
  })
}



$buttons.eq(0).on('click', function() {
  $("#slides").css
})


function makeFakeSlides() {
  let $firstCopy = $images.eq(0).clone(true);
  let $lastCopy = $images.eq($images.length - 1).clone(true);

  $slides.append($firstCopy);
  $slides.prepend($lastCopy);
}

<div class="window">
  <div class="images" id="slides">
    <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1543944704208&di=d4fb8a222f125e395bfb3e44a2a0b369&imgtype=0&src=http%3A%2F%2Fpic42.photophoto.cn%2F20170103%2F1155116883375520_b.jpg"
    width=300 alt="图片1" height=200>
    <img src="https://canna-pet.com/wp-content/uploads/2017/06/20-longest-living-dog-breeds_canna-pet-e1498599846169.jpg"
    width=300 alt="" height=200>
    <img src="https://fthmb.tqn.com/0ui_Zw01Ht9NHJkSBlqOIC1IH44=/960x0/filters:no_upscale()/yorkshire-terrier-583788122-581630e85f9b581c0b018a00.jpg"
    width=300 alt="" height=200>
    <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1543944744069&di=3ae9f3f8034f49565a0bedc879bcd336&imgtype=0&src=http%3A%2F%2Fimgsrc.baidu.com%2Fimgad%2Fpic%2Fitem%2F728da9773912b31be8eb5f0c8c18367adab4e114.jpg"
    width=300 alt="" height=200>
  </div>
</div>
<div id="buttonWrapper" style="text-alight:center">
  <button>
    1
  </button>
  <button>
    2
  </button>
  <button>
    3
  </button>
</div>
<!-- <span id=buttons>
<span class="active">第1张</span>
<span>第2张</span>
<span>第3张</span>
<span>第4张</span>
</span>
<div id="num">9</div> -->

* {
  margin: 0;
  padding: 0;
}

* {
  box-sizing: border-box;
}

.window {
  width: 400px;
  height: 200px;
  margin: 20px auto;
  overflow: hidden;
  border:1px solid red;
}

.images {
  display: flex;
  transtion: all 1s;
}

.images > img {
  width: 100%;
}