Travis build: 2032

README.md

@@ -197,6 +197,7 @@ average(1, 2, 3);
 * [`arrayToHtmlList`](#arraytohtmllist)
 * [`bottomVisible`](#bottomvisible)
 * [`copyToClipboard`](#copytoclipboard-)
+* [`counter`](#counter-)
 * [`createElement`](#createelement)
 * [`createEventHub`](#createeventhub-)
 * [`currentURL`](#currenturl)
@@ -3077,6 +3078,42 @@ copyToClipboard('Lorem ipsum'); // 'Lorem ipsum' copied to clipboard.
 <br>[⬆ Back to top](#table-of-contents)
 
 
+### counter ![advanced](/advanced.svg)
+
+Creates a counter with the specified range, step and duration for the specified selector.
+
+Check if `step` has the proper sign and change it accordingly.
+Use `setInterval()` in combination with `Math.abs()` and `Math.floor()` to calculate the time between each new text draw.
+Use `document.querySelector().innerHTML` to update the value of the selected element.
+Omit the fourth parameter, `step`, to use a default step of `1`.
+Omit the fifth parameter, `duration`, to use a default duration of `2000`ms.
+
+```js
+const counter = (selector, start, end, step = 1, duration = 2000) => {
+  let current = start,
+    _step = (end - start) * step < 0 ? -step : step,
+    timer = setInterval(() => {
+      current += _step;
+      document.querySelector(selector).innerHTML = current;
+      if (current >= end) document.querySelector(selector).innerHTML = end;
+      if (current >= end) clearInterval(timer);
+    }, Math.abs(Math.floor(duration / (end - start))));
+  return timer;
+};
+```
+
+<details>
+<summary>Examples</summary>
+
+```js
+counter('#my-id', 1, 1000, 5, 2000); // Creates a 2-second timer for the element with id="my-id"
+```
+
+</details>
+
+<br>[⬆ Back to top](#table-of-contents)
+
+
 ### createElement
 
 Creates an element from a string (without appending it to the document).