Jump to content


  • Posts

  • Joined

  • Last visited

Recent Profile Visitors

1,899 profile views

cbg's Achievements



  1. I've created a Codepen where I've been able to reproduce the issue, hopefully that helps? Adding a bunch of long divs above the scrolling part creates the issue? https://codepen.io/cbg/pen/oNLrXjJ Also, when I move the scrolling part to the top of the DOM, the issue goes away, regardless of the content.
  2. Thanks Zach. I got this all working standalone but when I pull it into my project it's jumping around and not working properly. Something on the page is conflicting with it but I can't figure out what, do you know what it is? Thanks again. My project (doesn't work): https://scrolltriggertest.webflow.io Standalone version (works): https://scrolltriggertest.webflow.io/home-copy
  3. I originally tried but I think I was removing the wrong sections, thanks for the tip of looking for 'scroller'. I think I've cracked it now, second times a charm! Could you sanity check this for me please? Appears to be behaving as expected though so thank you! https://codepen.io/cbg/pen/WNxByEj
  4. Hi guys, this looks great and is almost exactly what I'm after for a project of my own. I'm very new to ScrollTrigger and I wondered if someone could help me out with removing Locomotive Scroll from Camerons example? It's really just the pinning and horizontal scrolling I'm after. Any other examples I've found rely on full width sections, I like how this approach allows for content of any width and calculates the scrolling automatically. Thank you!
  5. Thanks @explorerzip, I usually do but it just ended up inline while I was debugging this one, will use it externally in future if it works. Cheers!
  6. Thanks @mikel but that wasn't the problem. I've just been tinkering with it some more this afternoon and found the issue, one of those silly ones! Basically when I remove GSDevTools (the playhead scrubber tool that lets you scrub through the ad) it works absolutely fine. GSDevTools just obviously wasn't playing ball with the new order. Thats a few hours I'll never get back! Thanks for all of your suggestions everyone.
  7. I think it isn't playing automatically on my Codepen because the DoubleClick code is executed on window.load however my GSAP is being executed before perhaps? Does that help anyone as a clue? Thank you.
  8. Hi ohm. That is how I originally had it setup but unfortunately, as mentioned in the original post, when the code is in that order the heights are being calculated differently. For example, compare the distance between the 'dates would go right here' text and the 'book now' button between your version and my version, you can see on your version it is much closer because the animations are being calculated before the content exists. Do you see what I mean? Thanks.
  9. Thanks for taking the time to respond ExplorerZip but that doesn’t really answer my question. I’ve launched many ads via DoubleClick studio with dynamic feeds so I’m aware of how that all works. My issue is more with how I can the Codepen included so that it plays automatically. As mentioned, I have reordered the code so that GSAP now takes into account the sizes of the dynamic elements correctly but the animation no longer starts automatically. thanks.
  10. I just realised a new problem I'm having is very similar to this one. I've tried implementing the DOM ready fix but in this instance the heights still aren't being calculated correctly? https://greensock.com/forums/topic/19539-loading-gsap-after-javascript-dynamically-generated-elements-have-loaded/?tab=comments#comment-90744
  11. I realised I've asked an almost identical question in the past but in this instance the heights still aren't being calculated correctly. https://greensock.com/forums/topic/18976-how-can-i-make-greensock-calculate-the-size-of-an-element-after-javascript-has-loaded/?tab=comments#comment-88118
  12. Hello, I'm trying to create a banner with GSAP and a DoubleClick dynamic feed. Basically dynamic content is pulled into my banner via JavaScript. In order to animate the content I need to wait until the content has been inserted first. This is because I'm animating the heights of DIVs that contain content and if I don't wait until the content has been inserted the heights will be wrong. I've tried various things like document ready and window onload but it doesn't seem to be working. The CodePen I have attached is the closest I've gotten but the issue is, now that I've reordered the code the GSAP animation no longer plays automatically. Could somebody help me please? https://codepen.io/cbg/pen/pqjbmx
  13. Hello, I'm producing an ad template for DoubleClick Studio using polite loading, this is my first time using this. The polite loading appears to work correctly but my GSAP animation plays straight away, how can I have my GSAP animation only begin after it has loaded like the other elements? You'll see on my CodePen that the ball moves before the 'loading' disappears. I know I need to put the animation code within the politeInit function, but when I do this, GSAP breaks completely and it never plays. Thanks JavaScript novice
  14. Thank you! Do you know how I can make the following run, only if the image exists in the DOM? .to ("#image2", 0.5, {opacity:0, delay: 3})
  15. Hello. I'm working on an animated display ad which uses dynamic content pulled in from a feed using JavaScript. I have an unordered list that is populated with content dynamically with JavaScript, the list could contain a variable amount of list items at varying lengths. When I try an animate this list with GreenSock (revealing it by animating the height from 0px) it animates the list based on the content not being there. How can I make GreenSock see the content that gets dynamically generated with JavaScript? Hopefully this makes sense, it's difficult to create a CodePen on this one since it links to external sources etc. Cheers