Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

OneManLaptop

ShockinglyGreen
  • Content Count

    28
  • Joined

  • Last visited

Community Reputation

12 Newbie

About OneManLaptop

  • Rank
    Member

Recent Profile Visitors

1,946 profile views
  1. Hey Zach, really appreciate the response and your helpful pointers. I did initially have GSAP handle all the animation, but I noticed that the GSAP flex tween seemed to give the animation a two step timing jump which native CSS transitions didn't have, so in this instance, I opted for a blend. As to the actual problem, I will indeed rebuild it as you say and separate the parts of the timeline out so that they're not fighting each other. Makes sense. As you can tell, I do often try to run before I can walk with the programming side of things. I'm basically a
  2. Hey folks. So I've been trying to apply a tween to a series of columns, which plays when the columns are individually hovered. I've completed this process several times for other projects, but for this project, I'm trying to not only tween the element I'm currently hovering over, but the elements I'm not and this is creating some unexpected and random behaviour. I've created a code pen with a reduced example which demonstrates the problem: https://codepen.io/OneManLaptop/pen/XWKBBpG The expected behaviour, is that when the user hovers over a column, the "Link" word fad
  3. That's super Jack, indeed, problem fixed! Thanks so much. As @elegantseagulls, said, I totally appreciate you have to strike a balance between controlling for edge case bugs and optimising the file size, but this problem would have certainly made testing scrollTrigger features a more onerous affair, so I am delighted it's been resolved with just a few tweaks. Thanks folks.
  4. Hey all. I'm building my first scroll trigger project (which is a stunning achievement... the plugin, not my ability to actually start a project hehe) and I may have stumbled across a conflict with how the markers are spaced when you change the units in the GSAP config. I prefer to use "rem" units when building websites, so I took advantage of the config method to switch most tweens to use them. When I tested my project after doing this, I noticed that there was a huge amount of white space added to the bottom of my website. After some testing, I discovered that either removing the
  5. This is great, some of these changes (particularly the switch from TweenMax to gsap and using the selector string) passed me by. When I start a new project I often copy older code over to use as a base! Time to update the base!
  6. Just a quick addendum to this. Is there any way to use clearProps and have it clear all GSAP traces from each element tweened in a timeline, without having to list every element separately that you want cleared? Thanks.
  7. Hey Carl, as ever thanks so much for looking at the demo and offering your advice. I've spent much of the morning experimenting with your suggestion and my demo and I'm much closer than I was in getting everything in the demo working. However there are still some noticeable issues and on reflection, the demo probably covers issues which perhaps go beyond the scope of what is reasonable to expect from a specialist, volunteer led forum such as this. Therefor I have decided to seek the assistance of somebody who can hold my hand - as it were - a little more and guide me through the logic of what
  8. Hello, Green Sock forum. I am having a few struggles which largely revolve around how to call and interact with time lines, which are nested inside a function. I have put together a very bare bones demo up on Codepen, which covers this. The expected functionality is: Click “click to run box”: 1: showContent function is called, which contains and runs the tlContent timeline. 2: onStart calls swapText function, which replaces large text with that contained in the data-text of the clicked nav link. 3: onComplete calls swapText function, which evaluates if tlContent is active,
  9. Echo all that, sadly without being able to deliver a kickass GSAP powered New Years animation. Been a great year for the platform though, I really think the seeds are firmly planted for a lot of growth next year. My continued thanks to all the members and mods who have been so generous with their time in helping us poor mortals out. I hope one day I can pay it back in helping up others. Have a good one!
  10. Hey, has the Codepen for this been deleted? Maybe it's a Codepen limitation / error, but given that this is a community centred around shared learning, it would be helpful if any Codepen's related to the thread were preserved, so that others can reference and learn from them. Thanks.
  11. Thanks for taking the time to look and comment. Anchoring the offSet via an array was definitely the key to fixing it. Excellent, thanks so much, a fixed Pen always helps a lot. So I'm right in saying that by adding the array, you anchored the offset to the correct parent node so it doesn't change on each click, and by using offSetTop rather than jquery.offset.top(); you get the distance relative to the parent rather than the document? Sorry, I've been reading some StackOverflow posts trying to work out the practical differences between our two examples. I know this is a GSAP
  12. I'm trying to use the scrollTo plugin to navigate around a div, however I'm getting unexpected behaviour, where the links don't seem to correspond to the element I want to scroll to and seem to erratically scroll along the y axis. As the stripped down example shows, the first three content blocks are anchored to the bottom of the container element, with the final content block being anchored to the top of the container. What I am looking to achieve, is to have the content scroll to the relevant relevant anchor, and where the scroll must move from a top to bottom content block, both the
  13. Haha, great work, it all links together so smoothly. Really nice.
  14. Cheers Carl, that's certainly fixed it and it's prompted me to brush up on the details of the tween / timeline relationship. Thanks for your fast and thorough help as always.
×