Quit using % since it was inaccurate in rare cases.

dist/js/splide.cjs.js

@@ -1182,26 +1182,21 @@ function Layout(Splide2, Components2, options) {
   };
 }
 
-const SNAP_THRESHOLD = 10;
-
 function Move(Splide2, Components2, options) {
   const { on, emit } = EventInterface(Splide2);
   const { slideSize, getPadding, totalSize, listSize, sliderSize } = Components2.Layout;
   const { resolve, orient } = Components2.Direction;
   const { list, track } = Components2.Elements;
   let waiting;
-  let shouldSnap = true;
   function mount() {
     if (!Splide2.is(FADE)) {
       on([EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH], reposition, DEFAULT_EVENT_PRIORITY - 1);
     }
   }
   function reposition() {
-    if (exceededLimit(true)) {
-      translate(getLimit(true));
-    } else if (shouldSnap || (shouldSnap = canSnap())) {
-      jump(Splide2.index);
-    }
+    Components2.Scroll.cancel();
+    cancel();
+    jump(Splide2.index);
   }
   function move(dest, index, prev, callback) {
     if (!isBusy()) {
@@ -1228,9 +1223,7 @@ function Move(Splide2, Components2, options) {
     translate(toPosition(index, true));
   }
   function translate(position) {
-    position = loop(position);
-    shouldSnap = canSnap(position);
-    Components2.Style.ruleBy(list, "transform", `translate${resolve("X")}(${100 * position / listSize()}%)`);
+    Components2.Style.ruleBy(list, "transform", `translate${resolve("X")}(${loop(position)}px)`);
   }
   function loop(position) {
     if (!waiting && Splide2.is(LOOP)) {
@@ -1285,10 +1278,6 @@ function Move(Splide2, Components2, options) {
   function getLimit(max) {
     return toPosition(max ? Components2.Controller.getEnd() : 0, !!options.trimSpace);
   }
-  function canSnap(position) {
-    position = isUndefined(position) ? getPosition() : position;
-    return abs(position - toPosition(toIndex(position), true)) < SNAP_THRESHOLD;
-  }
   function isBusy() {
     return !!waiting;
   }

dist/js/splide.esm.js

@@ -1178,26 +1178,21 @@ function Layout(Splide2, Components2, options) {
   };
 }
 
-const SNAP_THRESHOLD = 10;
-
 function Move(Splide2, Components2, options) {
   const { on, emit } = EventInterface(Splide2);
   const { slideSize, getPadding, totalSize, listSize, sliderSize } = Components2.Layout;
   const { resolve, orient } = Components2.Direction;
   const { list, track } = Components2.Elements;
   let waiting;
-  let shouldSnap = true;
   function mount() {
     if (!Splide2.is(FADE)) {
       on([EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH], reposition, DEFAULT_EVENT_PRIORITY - 1);
     }
   }
   function reposition() {
-    if (exceededLimit(true)) {
-      translate(getLimit(true));
-    } else if (shouldSnap || (shouldSnap = canSnap())) {
-      jump(Splide2.index);
-    }
+    Components2.Scroll.cancel();
+    cancel();
+    jump(Splide2.index);
   }
   function move(dest, index, prev, callback) {
     if (!isBusy()) {
@@ -1224,9 +1219,7 @@ function Move(Splide2, Components2, options) {
     translate(toPosition(index, true));
   }
   function translate(position) {
-    position = loop(position);
-    shouldSnap = canSnap(position);
-    Components2.Style.ruleBy(list, "transform", `translate${resolve("X")}(${100 * position / listSize()}%)`);
+    Components2.Style.ruleBy(list, "transform", `translate${resolve("X")}(${loop(position)}px)`);
   }
   function loop(position) {
     if (!waiting && Splide2.is(LOOP)) {
@@ -1281,10 +1274,6 @@ function Move(Splide2, Components2, options) {
   function getLimit(max) {
     return toPosition(max ? Components2.Controller.getEnd() : 0, !!options.trimSpace);
   }
-  function canSnap(position) {
-    position = isUndefined(position) ? getPosition() : position;
-    return abs(position - toPosition(toIndex(position), true)) < SNAP_THRESHOLD;
-  }
   function isBusy() {
     return !!waiting;
   }

dist/js/splide.js

@@ -1394,8 +1394,6 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     };
   }
 
-  var SNAP_THRESHOLD = 10;
-
   function Move(Splide2, Components2, options) {
     var _EventInterface6 = EventInterface(Splide2),
         on = _EventInterface6.on,
@@ -1414,7 +1412,6 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
         list = _Components2$Elements3.list,
         track = _Components2$Elements3.track;
     var waiting;
-    var shouldSnap = true;
 
     function mount() {
       if (!Splide2.is(FADE)) {
@@ -1423,11 +1420,9 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     }
 
     function reposition() {
-      if (exceededLimit(true)) {
-        translate(getLimit(true));
-      } else if (shouldSnap || (shouldSnap = canSnap())) {
-        jump(Splide2.index);
-      }
+      Components2.Scroll.cancel();
+      cancel();
+      jump(Splide2.index);
     }
 
     function move(dest, index, prev, callback) {
@@ -1458,9 +1453,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     }
 
     function translate(position) {
-      position = loop(position);
-      shouldSnap = canSnap(position);
-      Components2.Style.ruleBy(list, "transform", "translate" + resolve("X") + "(" + 100 * position / listSize() + "%)");
+      Components2.Style.ruleBy(list, "transform", "translate" + resolve("X") + "(" + loop(position) + "px)");
     }
 
     function loop(position) {
@@ -1530,11 +1523,6 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       return toPosition(max ? Components2.Controller.getEnd() : 0, !!options.trimSpace);
     }
 
-    function canSnap(position) {
-      position = isUndefined(position) ? getPosition() : position;
-      return abs(position - toPosition(toIndex(position), true)) < SNAP_THRESHOLD;
-    }
-
     function isBusy() {
       return !!waiting;
     }

dist/types/components/Move/Move.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Move.d.ts","sourceRoot":"","sources":["Move.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAK9E;;;;GAIG;AACH,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD,IAAI,CAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,WAAW,GAAI,IAAI,CAAC;IAChF,IAAI,CAAE,KAAK,EAAE,MAAM,GAAI,IAAI,CAAC;IAC5B,SAAS,CAAE,QAAQ,EAAE,MAAM,GAAI,IAAI,CAAC;IACpC,MAAM,IAAI,IAAI,CAAC;IACf,OAAO,CAAE,QAAQ,EAAE,MAAM,GAAI,MAAM,CAAC;IACpC,UAAU,CAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACxD,WAAW,IAAI,MAAM,CAAC;IACtB,QAAQ,CAAE,GAAG,EAAE,OAAO,GAAI,MAAM,CAAC;IACjC,MAAM,IAAI,OAAO,CAAC;IAClB,aAAa,CAAE,GAAG,CAAC,EAAE,OAAO,GAAG,SAAS,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAI,OAAO,CAAC;CACxE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,IAAI,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,aAAa,CAmQ9F"}
+{"version":3,"file":"Move.d.ts","sourceRoot":"","sources":["Move.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAI9E;;;;GAIG;AACH,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD,IAAI,CAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,WAAW,GAAI,IAAI,CAAC;IAChF,IAAI,CAAE,KAAK,EAAE,MAAM,GAAI,IAAI,CAAC;IAC5B,SAAS,CAAE,QAAQ,EAAE,MAAM,GAAI,IAAI,CAAC;IACpC,MAAM,IAAI,IAAI,CAAC;IACf,OAAO,CAAE,QAAQ,EAAE,MAAM,GAAI,MAAM,CAAC;IACpC,UAAU,CAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACxD,WAAW,IAAI,MAAM,CAAC;IACtB,QAAQ,CAAE,GAAG,EAAE,OAAO,GAAI,MAAM,CAAC;IACjC,MAAM,IAAI,OAAO,CAAC;IAClB,aAAa,CAAE,GAAG,CAAC,EAAE,OAAO,GAAG,SAAS,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAI,OAAO,CAAC;CACxE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,IAAI,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,aAAa,CA6O9F"}

dist/types/components/Move/constants.d.ts

@@ -1,7 +0,0 @@
-/**
- * The threshold for snapping the slider to the closest slide.
- *
- * @since 3.0.0
- */
-export declare const SNAP_THRESHOLD = 10;
-//# sourceMappingURL=../../../../src/js/components/Move/constants.d.ts.map

dist/types/components/Move/constants.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["constants.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,eAAO,MAAM,cAAc,KAAK,CAAC"}

dist/types/test/utils/utils.d.ts

@@ -18,13 +18,11 @@ export declare function init(options?: Options, args?: InitArgs): Splide;
 /**
  * Converts translate values to positions.
  *
- * @param elm        - An element to parse.
- * @param baseWidth  - The width of the element.
- * @param baseHeight - The height of the element.
+ * @param elm - An element to parse.
  *
  * @return An object with left and top offsets.
  */
-export declare function parseTransform(elm: HTMLElement, baseWidth: number, baseHeight: number): {
+export declare function parseTransform(elm: HTMLElement): {
     left: number;
     top: number;
 };

dist/types/test/utils/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,OAAO,EAAa,aAAa,EAAE,MAAM,aAAa,CAAC;AAIvD,UAAU,QAAS,SAAQ,aAAa;IACtC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;;;;GAOG;AACH,wBAAgB,IAAI,CAAE,OAAO,GAAE,OAAY,EAAE,IAAI,GAAE,QAAa,GAAI,MAAM,CAqFzE;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAC5B,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,MAAM,EACjB,UAAU,EAAE,MAAM,GACjB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAmB/B;AAED;;;;;;;;;GASG;AACH,wBAAgB,IAAI,CAClB,MAAM,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,EACnC,IAAI,EAAE,MAAM,EACZ,IAAI,GAAE,GAAQ,EACd,aAAa,GAAE,SAAc,GAC5B,KAAK,CAUP;AAED;;;;;GAKG;AACH,wBAAgB,OAAO,CAAE,GAAG,EAAE,MAAM,EAAE,MAAM,GAAE,MAAM,GAAG,OAAgB,GAAI,IAAI,CAE9E;AAED;;;;;;GAMG;AACH,wBAAgB,IAAI,CAAE,QAAQ,EAAE,MAAM,GAAI,OAAO,CAAC,IAAI,CAAC,CAItD;AAED;;;;;;GAMG;AACH,wBAAgB,QAAQ,CAAE,QAAQ,EAAE,MAAM,GAAI,YAAY,CAMzD;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAE,MAAM,EAAE,MAAM,GAAG,WAAW,GAAI,YAAY,CAEvE"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,OAAO,EAAa,aAAa,EAAE,MAAM,aAAa,CAAC;AAIvD,UAAU,QAAS,SAAQ,aAAa;IACtC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;;;;GAOG;AACH,wBAAgB,IAAI,CAAE,OAAO,GAAE,OAAY,EAAE,IAAI,GAAE,QAAa,GAAI,MAAM,CAuFzE;AAED;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAE,GAAG,EAAE,WAAW,GAAI;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAiBhF;AAED;;;;;;;;;GASG;AACH,wBAAgB,IAAI,CAClB,MAAM,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,EACnC,IAAI,EAAE,MAAM,EACZ,IAAI,GAAE,GAAQ,EACd,aAAa,GAAE,SAAc,GAC5B,KAAK,CAUP;AAED;;;;;GAKG;AACH,wBAAgB,OAAO,CAAE,GAAG,EAAE,MAAM,EAAE,MAAM,GAAE,MAAM,GAAG,OAAgB,GAAI,IAAI,CAE9E;AAED;;;;;;GAMG;AACH,wBAAgB,IAAI,CAAE,QAAQ,EAAE,MAAM,GAAI,OAAO,CAAC,IAAI,CAAC,CAItD;AAED;;;;;;GAMG;AACH,wBAAgB,QAAQ,CAAE,QAAQ,EAAE,MAAM,GAAI,YAAY,CAMzD;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAE,MAAM,EAAE,MAAM,GAAG,WAAW,GAAI,YAAY,CAEvE"}

src/js/components/Move/Move.ts

@@ -1,4 +1,3 @@
-import { TTB } from '../../constants/directions';
 import { EVENT_MOVE, EVENT_MOVED, EVENT_REFRESH, EVENT_RESIZED, EVENT_UPDATED } from '../../constants/events';
 import { DEFAULT_EVENT_PRIORITY } from '../../constants/priority';
 import { IDLE, MOVING } from '../../constants/states';
@@ -7,7 +6,6 @@ import { EventInterface } from '../../constructors';
 import { Splide } from '../../core/Splide/Splide';
 import { AnyFunction, BaseComponent, Components, Options } from '../../types';
 import { abs, clamp, isUndefined, rect } from '../../utils';
-import { SNAP_THRESHOLD } from './constants';
 
 
 /**
@@ -50,11 +48,6 @@ export function Move( Splide: Splide, Components: Components, options: Options )
    */
   let waiting: boolean;
 
-  /**
-   * Indicates whether the the slider should snap the position to the specific slide or not.
-   */
-  let shouldSnap = true;
-
   /**
    * Called when the component is mounted.
    */
@@ -69,11 +62,9 @@ export function Move( Splide: Splide, Components: Components, options: Options )
    * This must be called before the Slide component checks the visibility.
    */
   function reposition(): void {
-    if ( exceededLimit( true ) ) {
-      translate( getLimit( true ) );
-    } else if ( shouldSnap || ( shouldSnap = canSnap() ) ) {
-      jump( Splide.index );
-    }
+    Components.Scroll.cancel();
+    cancel();
+    jump( Splide.index );
   }
 
   /**
@@ -124,13 +115,10 @@ export function Move( Splide: Splide, Components: Components, options: Options )
    * @param position - The position to move to.
    */
   function translate( position: number ): void {
-    position   = loop( position );
-    shouldSnap = canSnap( position );
-
     Components.Style.ruleBy(
       list,
       'transform',
-      `translate${ resolve( 'X' ) }(${ 100 * position / listSize() }%)`
+      `translate${ resolve( 'X' ) }(${ loop( position ) }px)`
     );
   }
 
@@ -249,18 +237,6 @@ export function Move( Splide: Splide, Components: Components, options: Options )
     return toPosition( max ? Components.Controller.getEnd() : 0, !! options.trimSpace );
   }
 
-  /**
-   * Checks if the provided position is enough close to some slide to snap or not.
-   *
-   * @param position - A position to test.
-   *
-   * @return `true` if found the slide to snap, or otherwise `false`.
-   */
-  function canSnap( position?: number ): boolean {
-    position = isUndefined( position ) ? getPosition() : position;
-    return abs( position - toPosition( toIndex( position ), true ) ) < SNAP_THRESHOLD;
-  }
-
   /**
    * Checks if the slider can move now or not.
    *

src/js/components/Move/constants.ts

@@ -1,6 +0,0 @@
-/**
- * The threshold for snapping the slider to the closest slide.
- *
- * @since 3.0.0
- */
-export const SNAP_THRESHOLD = 10;

src/js/components/Move/test/general.test.ts

@@ -9,10 +9,10 @@ describe( 'Move', () => {
     const rule = findRuleBy( list );
 
     Move.jump( 2 );
-    expect( rule.style.transform ).toBe( 'translateX(-200%)' );
+    expect( rule.style.transform ).toBe( 'translateX(-400px)' );
 
     Move.jump( 4 );
-    expect( rule.style.transform ).toBe( 'translateX(-400%)' );
+    expect( rule.style.transform ).toBe( 'translateX(-800px)' );
 
     splide.destroy();
   } );
@@ -24,30 +24,24 @@ describe( 'Move', () => {
     const rule = findRuleBy( list );
 
     Move.translate( 100 );
-    expect( rule.style.transform ).toBe( 'translateX(50%)' );
+    expect( rule.style.transform ).toBe( 'translateX(100px)' );
 
     Move.translate( 500 );
-    expect( rule.style.transform ).toBe( 'translateX(250%)' );
+    expect( rule.style.transform ).toBe( 'translateX(500px)' );
 
     splide.destroy();
   } );
 
   test( 'can loop the slider if it exceeds bounds.', () => {
     // Note: All clones do not have dimensions.
-    const width     = 200;
-    const splide    = init( { type: 'loop', width, height: 100 } );
-    const totalSize = width * splide.length;
-    const { Move }  = splide.Components;
-    const { list }  = splide.Components.Elements;
+    const width    = 200;
+    const splide   = init( { type: 'loop', width, height: 100 } );
+    const { Move } = splide.Components;
+    const { list } = splide.Components.Elements;
     const rule = findRuleBy( list );
 
     Move.translate( width );
-    expect( rule.style.transform ).toBe( `translateX(${ -100 * ( splide.length - 1 ) }%)` );
-
-    Move.translate( 0 );
-
-    Move.translate( - totalSize );
-    expect( rule.style.transform ).toBe( `translateX(-100%)` ); // 1 slide
+    expect( rule.style.transform ).toBe( `translateX(${ -width * ( splide.length - 1 ) }px)` );
 
     splide.destroy();
   } );

src/js/components/Move/test/move.test.ts

@@ -12,11 +12,11 @@ describe( 'Move#move()', () => {
 
     Move.move( 1, 1, -1 );
     fire( list, 'transitionend' );
-    expect( rule.style.transform ).toBe( 'translateX(-100%)' );
+    expect( rule.style.transform ).toBe( 'translateX(-200px)' );
 
     Move.move( 2, 2, -1 );
     fire( list, 'transitionend' );
-    expect( rule.style.transform ).toBe( 'translateX(-200%)' );
+    expect( rule.style.transform ).toBe( 'translateX(-400px)' );
   } );
 
   test( 'can change the state.', () => {

src/js/components/Scroll/test/general.test.ts

@@ -7,6 +7,9 @@ describe( 'Scroll', () => {
     const splide   = init();
     const duration = 100;
 
+    // Waiting for the initial reposition. It will cancel scrolling.
+    await wait( 100 );
+
     splide.Components.Scroll.scroll( -100, duration );
 
     await wait( duration + 10 );
@@ -21,6 +24,8 @@ describe( 'Scroll', () => {
     const duration = 200;
     const { getPosition } = splide.Components.Move;
 
+    await wait( 100 );
+
     splide.Components.Scroll.scroll( -100, duration );
 
     await wait( duration / 2 );

src/js/components/Style/test/general.test.ts

@@ -16,7 +16,7 @@ describe( 'Style', () => {
       } );
 
       expect( listRule ).not.toBeUndefined();
-      expect( listRule.style.transform ).toBe( 'translateX(0%)' );
+      expect( listRule.style.transform ).toBe( 'translateX(0px)' );
     }
 
     splide.destroy();

src/js/test/assets/css/styles.css

@@ -18,6 +18,10 @@ img {
 .splide__track {
 }
 
+.splide__slide {
+  border: 2px solid transparent;
+}
+
 .splide__slide.is-visible {
   border: 2px solid darkgray;
 }

src/js/test/php/examples/default.php

@@ -20,12 +20,13 @@ $settings = get_settings();
     document.addEventListener( 'DOMContentLoaded', function () {
       var splide = new Splide( '#splide01', {
         type   : 'loop',
-        perPage: 3,
-        perMove: 1,
+        perPage: 1,
         gap    : '1.5rem',
         height : 400,
         // focus  : 'center',
         // cover  : true,
+        // speed: 1000,
+        // padding: '20%',
         classes: {
           arrows: 'splide__arrows splide__test',
           clone : 'splide__clone splide__test',

src/js/test/utils/utils.ts

@@ -79,15 +79,17 @@ export function init( options: Options = {}, args: InitArgs = {} ): Splide {
   };
 
   list.getBoundingClientRect = (): DOMRect => {
+    const parsed = parseTransform( list as HTMLElement );
+
     return assign( {}, domRect, {
       width: +width,
-      ...parseTransform( list as HTMLElement, +width, +height ),
+      ...parseTransform( list as HTMLElement ),
     } );
   };
 
   slides.forEach( ( slide, index ) => {
     slide.getBoundingClientRect = (): DOMRect => {
-      const offsets = parseTransform( list as HTMLElement, +width, +height );
+      const offsets = parseTransform( list as HTMLElement );
 
       return assign( {}, domRect, {
         width : slideWidth,
@@ -110,17 +112,11 @@ export function init( options: Options = {}, args: InitArgs = {} ): Splide {
 /**
  * Converts translate values to positions.
  *
- * @param elm        - An element to parse.
- * @param baseWidth  - The width of the element.
- * @param baseHeight - The height of the element.
+ * @param elm - An element to parse.
  *
  * @return An object with left and top offsets.
  */
-export function parseTransform(
-  elm: HTMLElement,
-  baseWidth: number,
-  baseHeight: number
-): { left: number, top: number } {
+export function parseTransform( elm: HTMLElement ): { left: number, top: number } {
   const rule     = findRuleBy( elm );
   const position = { left: 0, top: 0 };
 
@@ -128,13 +124,11 @@ export function parseTransform(
     const { transform } = rule.style;
 
     if ( transform.includes( 'translateX' ) ) {
-      const percent = parseFloat( transform.replace( /translateX\(|\)/g, '' ) ) || 0;
-      position.left = baseWidth * percent / 100;
+      position.left = parseFloat( transform.replace( /translateX\(|\)/g, '' ) ) || 0;
     }
 
     if ( transform.includes( 'translateY' ) ) {
-      const percent = parseFloat( transform.replace( /translateY\(|\)/g, '' ) ) || 0;
-      position.top = baseHeight * percent / 100;
+      position.top = parseFloat( transform.replace( /translateY\(|\)/g, '' ) ) || 0;
     }
   }
 

src/js/types/events.ts

@@ -31,8 +31,8 @@ export interface EventMap {
   'pagination:updated': [ PaginationData, PaginationItem, PaginationItem ];
   'navigation:mounted': [ Splide[] ];
   'autoplay:play': [];
-  'autoplay:playing': [];
-  'autoplay:pause': [ number ];
+  'autoplay:playing': [ number ];
+  'autoplay:pause': [];
   'lazyload:loaded': [ HTMLImageElement, SlideComponent ];
 }