vue-scrollto - npm Package Compare versions

Comparing version 2.6.10 to 2.7.0

package.json

 {
   "name": "vue-scrollto",
-  "version": "2.6.10",
+  "version": "2.7.0",
   "description": "Adds a directive that listens for click events and scrolls to elements.",
@@ -5,0 +5,0 @@ "main": "vue-scrollto.js",

src/scrollTo.js

@@ -38,5 +38,8 @@ import BezierEasing from "bezier-easing";
 
+    let initialX; // initial X of container
+    let targetX; // target X of container
     let initialY; // initial Y of container
     let targetY; // target Y of container
-    let diff; // difference
+    let diffX; // difference
+    let diffY; // difference
 
@@ -71,2 +74,15 @@ let abort; // is scrolling aborted
 
+    function scrollLeft(container) {
+        let scrollLeft = container.scrollLeft;
+
+        if (container.tagName.toLowerCase() === "body") {
+            // in firefox body.scrollLeft always returns 0
+            // thus if we are trying to get scrollLeft on a body tag
+            // we need to get it from the documentElement
+            scrollLeft = scrollLeft || document.documentElement.scrollLeft;
+        }
+
+        return scrollLeft;
+    }
+
     function step(timestamp) {
@@ -81,3 +97,7 @@ if (abort) return done();
 
-        top(container, initialY + diff * progress);
+        topLeft(
+            container,
+            initialY + diffY * progress,
+            initialX + diffX * progress
+        );
 
@@ -88,3 +108,3 @@ timeElapsed < duration ? window.requestAnimationFrame(step) : done();
     function done() {
-        if (!abort) top(container, targetY);
+        if (!abort) topLeft(container, targetY, targetX);
         timeStart = false;
@@ -97,4 +117,5 @@
 
-    function top(element, top) {
+    function topLeft(element, top, left) {
         element.scrollTop = top;
+        element.scrollLeft = left;
         if (element.tagName.toLowerCase() === "body") {
@@ -105,2 +126,3 @@ // in firefox body.scrollTop doesn't scroll the page
             document.documentElement.scrollTop = top;
+            document.documentElement.scrollLeft = left;
         }
@@ -133,10 +155,14 @@ }
 
+        var cumulativeOffset = _.cumulativeOffset(element);
+
         initialY = scrollTop(container);
-        targetY = _.cumulativeOffset(element).top -
-            container.offsetTop +
-            offset;
+        targetY = cumulativeOffset.top - container.offsetTop + offset;
 
+        initialX = scrollLeft(container);
+        targetX = cumulativeOffset.left - container.offsetLeft + offset;
+
         abort = false;
 
-        diff = targetY - initialY;
+        diffY = targetY - initialY;
+        diffX = targetX - initialX;
 
@@ -149,3 +175,3 @@ if (typeof easing === "string") {
 
-        if (!diff) return;
+        if (!diffY && !diffX) return;
 
@@ -152,0 +178,0 @@ _.on(container, abortEvents, abortFn, { passive: true });

src/utils.js

@@ -26,5 +26,7 @@ export default {
         let top = 0;
+        let left = 0;
 
         do {
             top += element.offsetTop || 0;
+            left += element.offsetLeft || 0;
             element = element.offsetParent;
@@ -34,5 +36,6 @@ } while (element);
         return {
-            top: top
+            top: top,
+            left: left
         };
     }
 };

vue-scrollto.js

@@ -145,5 +145,7 @@ (function (global, factory) {
         var top = 0;
+        var left = 0;
 
         do {
             top += element.offsetTop || 0;
+            left += element.offsetLeft || 0;
             element = element.offsetParent;
@@ -153,3 +155,4 @@ } while (element);
         return {
-            top: top
+            top: top,
+            left: left
         };
@@ -191,5 +194,8 @@ }
 
+    var initialX = void 0; // initial X of container
+    var targetX = void 0; // target X of container
     var initialY = void 0; // initial Y of container
     var targetY = void 0; // target Y of container
-    var diff = void 0; // difference
+    var diffX = void 0; // difference
+    var diffY = void 0; // difference
 
@@ -224,2 +230,15 @@ var abort = void 0; // is scrolling aborted
 
+    function scrollLeft(container) {
+        var scrollLeft = container.scrollLeft;
+
+        if (container.tagName.toLowerCase() === "body") {
+            // in firefox body.scrollLeft always returns 0
+            // thus if we are trying to get scrollLeft on a body tag
+            // we need to get it from the documentElement
+            scrollLeft = scrollLeft || document.documentElement.scrollLeft;
+        }
+
+        return scrollLeft;
+    }
+
     function step(timestamp) {
@@ -234,3 +253,3 @@ if (abort) return done();
 
-        top(container, initialY + diff * progress);
+        topLeft(container, initialY + diffY * progress, initialX + diffX * progress);
 
@@ -241,3 +260,3 @@ timeElapsed < duration ? window.requestAnimationFrame(step) : done();
     function done() {
-        if (!abort) top(container, targetY);
+        if (!abort) topLeft(container, targetY, targetX);
         timeStart = false;
@@ -250,4 +269,5 @@
 
-    function top(element, top) {
+    function topLeft(element, top, left) {
         element.scrollTop = top;
+        element.scrollLeft = left;
         if (element.tagName.toLowerCase() === "body") {
@@ -258,2 +278,3 @@ // in firefox body.scrollTop doesn't scroll the page
             document.documentElement.scrollTop = top;
+            document.documentElement.scrollLeft = left;
         }
@@ -285,8 +306,14 @@ }
 
+        var cumulativeOffset = _.cumulativeOffset(element);
+
         initialY = scrollTop(container);
-        targetY = _.cumulativeOffset(element).top - container.offsetTop + offset;
+        targetY = cumulativeOffset.top - container.offsetTop + offset;
 
+        initialX = scrollLeft(container);
+        targetX = cumulativeOffset.left - container.offsetLeft + offset;
+
         abort = false;
 
-        diff = targetY - initialY;
+        diffY = targetY - initialY;
+        diffX = targetX - initialX;
 
@@ -299,3 +326,3 @@ if (typeof easing === "string") {
 
-        if (!diff) return;
+        if (!diffY && !diffX) return;
 
@@ -302,0 +329,0 @@ _.on(container, abortEvents, abortFn);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

28109

increased by8.02%

Lines of code

590

increased by8.46%

No dependency changes