feat(effect-cards): add rotate parameter

fixes #5575
nolimits4web · Apr 8, 2022 · 5f4ca8a · 5f4ca8a
1 parent 213c8fe
commit 5f4ca8a
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/src/modules/effect-cards/effect-cards.js b/src/modules/effect-cards/effect-cards.js
@@ -8,6 +8,7 @@ export default function EffectCards({ swiper, extendParams, on }) {
     cardsEffect: {
       slideShadows: true,
       transformEl: null,
+      rotate: true,
     },
   });
 
@@ -76,9 +77,10 @@ export default function EffectCards({ swiper, extendParams, on }) {
 
       const scaleString =
         progress < 0 ? `${1 + (1 - scale) * progress}` : `${1 - (1 - scale) * progress}`;
+
       const transform = `
         translate3d(${tX}, ${tY}, ${tZ}px)
-        rotateZ(${rotate}deg)
+        rotateZ(${params.rotate ? rotate : 0}deg)
         scale(${scaleString})
       `;
 

diff --git a/src/types/modules/effect-cards.d.ts b/src/types/modules/effect-cards.d.ts
@@ -11,6 +11,12 @@ export interface CardsEffectOptions {
    * @default true
    */
   slideShadows?: boolean;
+  /**
+   * Enables cards rotation
+   *
+   * @default true
+   */
+  rotate?: boolean;
   /**
    * CSS selector of the element inside of the slide to transform instead of the slide itself. Useful to use with cssMode
    *