如何使用jQuery创建图像滑块

Question

我使用jquery动画和css函数创建了滑块，但是它没有保持滑动功能。

这是我的HTML代码

<div id="slider">
             <ul>
                 <li><img  src="img1.png" style="width: 1366px;display: inline-block;height: 400px;" ></li>
                  <li><img style="height:200px;width: 1366px;display: inline-block;height: 400px;" src="img2.png" ></li>
                 <li><img  src="img1.png" style="width: 1366px;display: inline-block;height: 400px;" ></li>
              </ul>
         </div>

这是我的Jquery代码，在此代码中，我在if语句内使用jquery css函数，但是它不起作用，并且动画函数会在所有图像滑动后创建反向图像流。我正在使用jquery版本3.3.1

 $(document).ready(function(){

 var total_count=$("#slider img").length;


               console.log(total_count);

              var count=0;
             var zero =-1500;
             setInterval(function (){

                  $("#slider").animate({'marginLeft':zero},2000);

                 zero-=1500;
                 ++count;
                 if(count == total_count){
                    zero=0;
                     count=0; 

                    $("#slider").css("margin-left","0px");
                 }


            },4000);


         });