Tukukkk

I have the below script which automatically scrolls right to slide the images. Unfortunately I'm not able to reset the counter. I've done a condition to see if the scroll is finished, and if it is then reset the width of the scroll, but it seems to not be working. However, if instead of reseting the scroll, I place an alert - then resetting the width works, but scrolling is still not working.

All is working good until the for loop ends and I'm not able to reset the scroll to the beginning.

Here is the script:

      <script>

 $(function ($) {

  $('#headw').on('scroll', function () {

      if($(this).scrollLeft() + $(this).innerWidth() >= $(this)[0].scrollWidth) {



         // RESET THE COUNTER 

          $("#headw").animate({

                          scrollLeft: "+="+width+"px",

                            }, 3000);



       } 

       else if($(this).scrollLeft() === 0) {



      // Remove this part if you don't want your messages hidden again

      }

      else {



      }

    })

  });







      function doItAll() {

    // put state variables other than the actual loop control here



            function doTheLoop() {

                var i;

                var count;

                var total = <?php echo $row; ?>;

                var tx = total + 1;

                for (i = 0; i < total; i++) {                   



                      var width = $(".divisorx").outerWidth();

                      count = count + width;

                      $("#headw").animate({

                          scrollLeft: "+="+width+"px",

                       }, 3000);



                 }

                return(false);   // done running the loop

              }

            while (doTheLoop()) {}

            // do some things after the loop

           }



          doItAll();





    </script>