Handle issue when ticker is moved quickly using buttons

Gruntfile.js

@@ -6,7 +6,7 @@ module.exports = function(grunt) {
 
         uglify: {
             options: {
-                banner: '/*jQuery easy ticker v<%= pkg.version %> - (c) 2021 <%= pkg.author %>*/'
+                banner: '/*jQuery easy ticker v<%= pkg.version %> - (c) 2022 <%= pkg.author %>*/'
             },
             my_target: {
                 files: {

README.md

@@ -14,7 +14,7 @@ jQuery easy ticker is a news ticker like plugin which scrolls a list infinitely.
 * The speed of the transition can be changed.
 * Controls can be added in order to Play/pause or move the list up and down.
 * Cross browser support.
-* Light weight (2.72 KB - minified).
+* Light weight (2.76 KB - minified).
 
 ## Usage
 
@@ -100,4 +100,4 @@ Plugin's documentation is available in the plugin homepage. Please refer [this p
 
 ## License
 
-Copyright (c) 2021 [Aakash Chakravarthy](https://www.aakashweb.com/), released under the MIT License.
+Copyright (c) 2022 [Aakash Chakravarthy](https://www.aakashweb.com/), released under the MIT License.

easyticker.jquery.json

@@ -14,7 +14,7 @@
 		"vertical",
 		"easing"
     ],
-    "version": "3.2.1",
+    "version": "3.3.0",
     "author": {
         "name": "Aakash Chakravarthy",
         "url": "https://www.aakashweb.com/"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "jquery-easy-ticker",
-  "version": "3.2.1",
+  "version": "3.3.0",
   "description": "jQuery easy ticker plugin allows to add news ticker like scroll to list elements",
   "scripts": {
     "build": "grunt"

src/jquery.easy-ticker.js

@@ -1,5 +1,5 @@
 /*
- * jQuery - Easy Ticker plugin - v3.2.1
+ * jQuery - Easy Ticker plugin - v3.3.0
  * https://www.aakashweb.com/
  * Copyright 2021, Aakash Chakravarthy
  * Released under the MIT License.
@@ -38,6 +38,7 @@
         s.elem = $(el);
         s.targ = $(el).children(':first-child');
         s.timer = 0;
+        s.moving = false;
 
         init();
         start();
@@ -111,6 +112,8 @@
         function move(dir){
             var sel, eq, appType;
 
+            if(s.moving) return;
+
             if(!s.elem.is(':visible')) return;
 
             if(dir == 'up'){
@@ -130,6 +133,8 @@
                 s.opts.callbacks.before.call(s, s.targ, selChild);
             }
 
+            s.moving = true;
+
             s.targ.stop(true, true).animate({
                 'top': eq + height + 'px'
             }, s.opts.speed, s.opts.easing, function(){
@@ -138,7 +143,9 @@
                 s.targ.css('top', 0);
 
                 adjustHeight(true);
-
+
+                s.moving = false;
+
                 if(typeof s.opts.callbacks.after === 'function'){
                     s.opts.callbacks.after.call(s, s.targ, selChild);
                 }

test/test.html

@@ -54,7 +54,14 @@
         myET.start();
     });
 
-    $('.myTicker3').easyTicker();
+    var ticker3 = $('.myTicker3').easyTicker().data('easyTicker');
+    $('.up3').click(function(){
+        ticker3.up();
+    });
+
+    $('.down3').click(function(){
+        ticker3.down();
+    });
 
 });
 </script>
@@ -92,6 +99,7 @@ <h2>Ticker 2</h2>
 </div>
 
 <h2>Ticker 3</h2>
+<button class="up3">Up</button> <button class="down3">Down</button>
 <div class="myTicker3">
     <ul>
         <li>Triangles can be made easily using CSS also without any images. This trick requires only div tags and some CSS works. To get this trick, just use the code below.</li>