无缝滚动，鼠标移动在上面时停止

css

.Dong {
            width:1200px;
            height:150px;
            border:1px solid black;
            box-sizing: border-box;
            margin:auto;
            overflow-y: hidden;
            overflow-x: hidden;

        }
        .kuang {
            width:5000px;
            height:150px;
        }
       .part1,.part2 {
            width:1250px;
            height:150px;
           float:left;
        }
        .part1>img,.part2>img{
            width:250px;
           height:150px;
           float:left;
        }
        
        .footer{
            width: 100%;
            height: 150px;
            background-color:rgb(168, 33, 28);
            position: relative;
            top: 50px;
        }

js

var dong =document.querySelector (".Dong");
      var part1=document.querySelector (".part1");
      var part2=document.querySelector (".part2");
      part2.innerHTML =part1.innerHTML ;
      function autoplay(){
          dong.scrollLeft -=2;
          if(dong.scrollLeft<=0){
             dong.scrollLeft=1250;
          }
      }
      var int=setInterval(autoplay,30);
      dong.onmouseover=function(){
          clearInterval(int);
      }
      dong.onmouseout=function(){
          int=setInterval(autoplay,30);
      }

html

 <div class="Dong">
            <div class="kuang">
                <div class="part1">
                    <img src="/c1.jpeg" alt=""/>
                    <img src="/c3.jpg" alt=""/>
                    <img src="/c2.jpg" alt=""/>
                    <img src="/c4.jpeg" alt=""/>
                    <img src="/c5.jpeg" alt=""/>
                </div>
                <div class="part2"></div>
            </div>
        </div>