Jump to content


  • Posts

  • Joined

  • Last visited

Mardzis's Achievements



  1. It hasn't worked on Browserstack either, but after I updated my ipad to latest iOS it works. Not sure what causes the problems. Thank you
  2. @GreenSock is there any other catch? I can't make it work on iPad, it works perfectly on iPhone.
  3. Yeah, I saw that the Codepen example works on iPad/iPhone. I will try implement all the changes you suggest which are necessary and I will see if it helps. Thanks
  4. Hello, I've using in past ScrollMagic with combinations before I discover ScrollTrigger, main reason was that I could make it work on mobile and table (iOS tested only) and since I moved from ScrollMagic to the awesome ScrollTrigger from gsap, I moved just two timelines both works on mobile (iPhone) but still without any changes on iPad. Is there any special thing I have to do to make it work on iPad? I'm using Webpack with GSAP 3.4.0. I don't see anything special why it shouldn't work. What could cause the problem? import {gsap, TweenMax, TimelineMax} from 'gsap'; import 'imports-loader?define=>false!scrollmagic/scrollmagic/uncompressed/plugins/debug.addIndicators'; import {TextPlugin} from 'gsap/TextPlugin'; import {CSSRulePlugin} from 'gsap/CSSRulePlugin'; import { ScrollTrigger } from "gsap/ScrollTrigger"; gsap.registerPlugin(TextPlugin, CSSRulePlugin, ScrollTrigger); $(function() { if (document.querySelector('.IntroAnimation')) { let introTl = gsap.timeline({ scrollTrigger: { trigger: '.IntroAnimation', start: "40px center", end: "bottom center", scrub: true, toggleActions: "restart pause reverse pause", markers: true } }); introTl.to('.IntroPlatform-base', {opacity: 0, scale: 0.8}); introTl.to('.IntroPlatform', {rotateX: 0, className: 'IntroPlatform hasShadowRow'}); introTl.to('.IntroPlatform-slide.isHidden', { display: 'block', opacity: 1, onReverseComplete: hideSlides, onComplete: allowSwipeIntro, }, '<'); introTl.to('.IntroPlatform.hasShadowRow', {opacity: 1}, '-=1'); introTl.to('.IntroPreview-play', {opacity: 1}); function hideSlides() { introSlider.slideTo(2); introSlider.allowSlideNext = false; introSlider.allowSlidePrev = false; } function allowSwipeIntro() { introSlider.allowSlideNext = true; introSlider.allowSlidePrev = true; } } });