search

Home  >  Q&A  >  body text

javascript - How to switch the last picture to the first picture in a seamless carousel?

<script>
    var next = document.getElementById("next");
    var prev = document.getElementById("prev");
    var ul = document.getElementsByTagName("ul")[0];
    var li = document.getElementsByTagName("li");
    var x=0;
    next.onclick = function(){
        x = x -289;
        ul.style.transform="translate3d("+x+"px,0,0)";    
    }
    prev.onclick = function(){
        x = x +289;
        ul.style.transform="translate3d("+x+"px,0,0)";
    }
</script>
習慣沉默習慣沉默2752 days ago652

reply all(2)I'll reply

  • 大家讲道理

    大家讲道理2017-05-16 13:44:50

    You can copy the first one and put it at the end. For example: 123451
    When the carousel reaches the last 1, return the entire carousel image to its original state.

    reply
    0
  • 大家讲道理

    大家讲道理2017-05-16 13:44:50

    Clone the carousel image into an identical one. (eg: (Picture 1 Picture 2 Picture 3) (Picture 1 Picture 2 Picture 3))

    When the picture moves to the serial number 1, determine whether there is a previous element. If it does not move the entire sroll to the front, then do the carousel, otherwise it will be directly carousel (in this case, pay attention to the left value of the positioning) Change first then)

    The same applies when moving to the last picture

    reply
    0
  • Cancelreply