]> _ Git - pmi.git/commitdiff
wip #2747 @0:10
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 9 Sep 2019 09:51:24 +0000 (11:51 +0200)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 9 Sep 2019 09:51:24 +0000 (11:51 +0200)
resources/js/carrousel.js

index 745b7e3d67e17bef6ab08715a1b29b2afee720e3..6c2073e4811773965f75e7f6a8dc8ec66d733307 100644 (file)
@@ -128,7 +128,7 @@ window.Hammer = Hammer.default;
             this.finishAnimation = function () { // when animation is finished this function will be executed
 
                 $this.hammerSwipe.get('swipe').set({enable: true}); // swipe functionality is now reactivate
-                $this.currentSlideIndex.removeClass('active').eq($this.index);
+                $this.currentSlideIndex.removeClass('active').addClass('hide');
 
                 if ($this.automode) {
                     $this.slideInterval = setTimeout(function () {
@@ -165,11 +165,10 @@ window.Hammer = Hammer.default;
                     ease: Power2.easeInOut
                 }, "-=" + 0.8 * $this.Delay);
 
-                tl.from($this.nextTextContainer, 0.5 * $this.Delay, {
+                tl.fromTo($this.nextTextContainer, 0.5 * $this.Delay, {
                     x: 80 * direction,
                     opacity: 0,
-                    ease: Power1.easeOut
-                }, '-=' + 1.2 * $this.Delay);
+                }, {ease: Power1.easeOut, opacity: 1, x: 0}, '-=' + 1.2 * $this.Delay);
 
                 tl.from($this.nextContainerImg, 1.5 * $this.Delay, {
                     x: 150 * direction,
@@ -194,22 +193,21 @@ window.Hammer = Hammer.default;
                 tl2.set($this.nextTextContainer, {transform: 'translateX(0px)', opacity: 1});
 
                 tl2.to($this.currentSlideIndex, 0.7, {
-                    transform: 'translateX(' + ($this.percent + '%') + ')',
+                    transform: 'translateX(' + ($this.negativePercent + '%') + ')',
                     ease: Power1.easeOut
                 });
                 tl2.to($this.currentTextBlock, 0.7, {opacity: 0}, '-=0.9');
                 tl2.from($this.nextSlideIndex, 0.7, {
-                    transform: 'translateX(' + ($this.negativePercent + '%') + ')',
+                    transform: 'translateX(' + ($this.percent + '%') + ')',
                     ease: Power1.easeOut
                 }, "-=0.7");
-                tl2.from($this.nextTextBlock, 0.7, {opacity: 0, x: -100 * direction});
+                tl2.from($this.nextTextBlock, 0.7, {opacity: 0, x: 100 * direction});
 
                 // reset all block style
-                tl2.set($this.currentTextBlock, {opacity: 1});
-                tl2.set($this.currentSlideIndex, {transform: 'translateX(0px)', opacity: 1});
-                tl2.set($this.nextSlideIndex, {transform: 'translateX(0px)', opacity: 1});
-                tl2.set($this.currentTextContainer, {transform: 'translateX(0px)', opacity: 1});
-                tl2.set($this.nextTextContainer, {transform: 'translateX(0px)', opacity: 1});
+                tl2.set($this.currentSlideIndex, {transform: 'translateX(0px)'});
+                tl2.set($this.nextSlideIndex, {transform: 'translateX(0px)'});
+                tl2.set($this.currentTextContainer, {transform: 'translateX(0px)'});
+                tl2.set($this.nextTextContainer, {transform: 'translateX(0px)'});
 
             }
             this.nextIndicatorIndex.addClass('active-indicator').eq(nextindex);
@@ -248,7 +246,7 @@ window.Hammer = Hammer.default;
                     direction = 1;
                 } else if (currentPosition > nextPosition) {
                     direction = -1;
-                } else if (currentPosition == nextPosition) {
+                } else if (currentPosition === nextPosition) {
                     return false;
                 }
                 $this.goToSlide(nextPosition, direction);