Shaun Gorneau last won the day on August 22

Shaun Gorneau had the most liked content!

Shaun Gorneau

Moderators
  • Content count

    427
  • Joined

  • Last visited

  • Days Won

    12

Shaun Gorneau last won the day on August 22

Shaun Gorneau had the most liked content!

Community Reputation

980 Leader

2 Followers

About Shaun Gorneau

  • Rank
    Advanced Member
  • Birthday May 31

Contact Methods

Profile Information

  • Gender
    Male
  • Location
    Hartford, CT

Recent Profile Visitors

4,572 profile views
  1. Shaun Gorneau

    Stop Greensock animation on second page refresh

    “Is there any other way to tackle this using frontend side ie, writing javascript?” Hi Pradeep, the two second options (cookie and local storage) are JavaScript solutions. Do you mean solutions other than those two?
  2. Shaun Gorneau

    Stop Greensock animation on second page refresh

    Hi @Pradeep KS, You'll need to set a hook somewhere on the client side to check against. There are a few ways to do that. If you are using server side code for anything, you could set a session variable on the first load, and then use the presence of that session variable to set a hook on the client side, for example ... <? $class = ''; if( $_SESSION['subsequent_visit'] ){ $class = ' subsequent-visit'; } ?> <body class="some-class another-class <? print $class;?>"> Which you can then check for before you create the timeline. Example if( document.querySelector('body.subsequent-visit').length < 1 ){ const tl = new timelineMax(); ... } Or, on the client side alone, you could set a cookie to check against, or a variable in local storage to check against. Hope this helps, Shaun
  3. Shaun Gorneau

    Counting down from 5 to 0 – proceed to next step

    Hi @hallibus. If I understand correctly, you're looking for setInterval and clearInterval. Hope this helps!
  4. Shaun Gorneau

    How to have two lines of timeline execute at same time?

    Whoa! That's going back! I'm not sure `appendMultiple` and `allTo` are supported any longer. I think you'd want to look at add() instead. (I could be wrong though)
  5. Shaun Gorneau

    How to have two lines of timeline execute at same time?

    Hi @kbeats, and welcome to GSAP! To get two tweens on a timeline to happen at the same time, you would set the position parameter. And more info on that https://greensock.com/position-parameter Happy tweening!
  6. Shaun Gorneau

    Callback using .add is returning undefined

    Hi @Forxs, of what does the function insertContent() comprise?
  7. Shaun Gorneau

    Unwanted white space at the bottom of the page generated by ScrollMagic

    Looked in Chrome, Safari, and Firefox here ... no white space 😕
  8. Shaun Gorneau

    Animation not smooth on iOS

    Hi @frankallen and welcome to GSAP! I haven't had too much to dive into it (I will in a little bit) ... but one thing we strongly suggest is isolating your issue into a CodePen. That helps in multiple ways; namely isolating the issue and recreating the issue with all other variables removed. I got one started for you here ... Hopefully I (or anyone) can help soon. Happy tweening!
  9. Shaun Gorneau

    Dynamically created timeline

    If I understand correctly ... this should do the trick (you can play with timings).
  10. Shaun Gorneau

    Button Hover (mouseenter, mouseleave) Problem

    Hi @lselby, might be easier to do the tweens right inside the event handlers.
  11. Shaun Gorneau

    Dynamically created timeline

    Sure thing ... but I want to clarify something before pointing you in a direction ... 3. By "Box will show up" ... do you mean appear instantly at X/Y, or tween to that position, fade in, something else? And what duration of time between "repeats"?
  12. Shaun Gorneau

    Dynamically created timeline

    Hi @Exhumator, you'll probably want to give function-based values a look. Check out this pen
  13. Shaun Gorneau

    On Click Scale Image to Full Screen

    Hi @Rakesh Roy, you'll want to do a few things to set this up to make it appear seamless. 1. Preload the full screen image and a bit of the "click through" content 2. Animate to the full screen state along with displaying the top of page content (already on the page) 3. AJAX to fetch the "click through" URL's content (or the content of a specific element at the target URL) 4. Load that content into a container to and hide the current page's main content container 5. Replace the current window.location ( history.pushState() ) This pen demonstrates a method for going from a tile to a full screen image ... in this particular case it's full width, but the principles are the same. Hope this helps!
  14. Shaun Gorneau

    Start Timeline when in view on screen

    @codekai98 Now worries ... I think a big part of the problem here is all pens are accomplishing many things (slide navigation, slide transitions, slide element tweens, etc.) In my example, all you really have to focus on is a small part with the " function moveToSlide( index )", notably // Slide moving to TweenMax.to('.wrapper', 1 , { y: -$('.wrapper').height()*(index-1), rotation: 0, ease: Power2.easeOut } ); TweenMax.to( intoSection.find('.background-image-wrapper'), 1 , { y: 0, rotation: 0 } ); TweenMax.to( intoSection.find('h2') , .5, { y: 0, autoAlpha: 1 } ); TweenMax.staggerTo( intoSection.find('.some-content') , .75, { y: 0, autoAlpha: 1, delay: .5 }, .125, function(){ isScrolling = false; } ); That is what is handling the tweening of elements on the slide being moved into (rather than being tween on page load).
  15. Shaun Gorneau

    Loop nested timeline with Timeline Lite

    You're welcome, @jordank On another note ... it might be useful to seek to a label on the master timeline rather than restart ... in the event that you want to loop the middle portion of a master timeline. Defining a label within each master timeline add() and then passing that label as a 3rd parameter to looper would take care of that.