TrulyNewbie

Thank you!

I also tried this but It doesnt work once I remove some li and leave only 5. https://codepen.io/NewbieRuby/pen/vYQLGVj

Hi I tried to make this vertical, I changed all the Xpercent to Ypercent. but it didnt quite work. Is there more work to it than that? I've looked a ton of other threads, but I couldn't seem to find one that would be vertical. I plan to repuprose the code to use it like redis agency Thank you

Hi I tried to make this vertical, I changed all the Xpercent to Ypercent. but it didnt quite work. Is there more work to it than that?

Thank you so much for pointing that out! My idea was that the two words are stacked, and as you scroll they scale down ad go side by side. So I've tried to code it myself, and i removed the button and I think I'm close. But somethings not right. The triggers dont work correctly. Sorry to pester you with questions https://codepen.io/NewbieRuby/pen/poxpxMw

Hi, I have an issue where I the container holding the flip changes height on flip change. Is there a way I can have the div not change height? My other issue is that when you click the button the flip happens, the height changes (which I dont want to happen) and then when you click the button again its like theres a delay in undoing the flip Thak you for your help flexflipping.mov

I see! Thank you Rodrigo! My mistake! For anyone else who may have this issue. I made GSAP a dependency on my custom js file, but I also needed to make JQUERY a dependancy too. from: wp_enqueue_script( 'gsap-app', get_template_directory_uri() . '/js/ruby-app.js', array('gsap-js'), false, true ); to: wp_enqueue_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js', array(), null, true); wp_enqueue_script( 'gsap-app', get_template_directory_uri() . '/js/ruby-app.js', array('jquery', 'gsap-js'), false, true );

My functions.php // The proper way to enqueue GSAP script in WordPress // wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer ); function theme_gsap_script(){ // The core GSAP library wp_enqueue_script( 'gsap-js', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/gsap.min.js', array(), false, true ); wp_enqueue_script( 'gsap-st', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/ScrollTrigger.min.js', array('gsap-js'), false, true ); wp_enqueue_script( 'gsap-scrl2', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/ScrollToPlugin.min.js', array('gsap-js'), false, true ); // Your animation code file - with gsap.js passed as a dependency wp_enqueue_script( 'gsap-ss', get_template_directory_uri() . '/js/ScrollSmoother.min.js', array('gsap-js'), false, true ); wp_enqueue_script( 'gsap-mrph', get_template_directory_uri() . '/js/MorphSVGPlugin.min.js' , array('gsap-js'), false, true ); wp_enqueue_script( 'gsap-splt', get_template_directory_uri() . '/js/SplitText.min.js', array('gsap-js'), false, true ); wp_enqueue_script( 'gsap-app', get_template_directory_uri() . '/js/ruby-app.js', array('gsap-js'), false, true ); } add_action( 'wp_enqueue_scripts', 'theme_gsap_script' ); add_action( 'wp_enqueue_scripts', 'themeprefix_slick_enqueue_scripts_styles' ); function themeprefix_slick_enqueue_scripts_styles() { wp_enqueue_script( 'slickjs', get_stylesheet_directory_uri() . '/js/slick.min.js', array( 'jquery' ), '1.6.0', true ); wp_enqueue_style( 'slickcss', get_stylesheet_directory_uri() . '/css/slick.css', '1.6.0', 'all'); }

Hi, I've built all my wordpress websites using GSAP using the exact same 'layout' of code. But recently when I began to use 3.11.3 as opposed to 3.10.3 I keep getting messages saying "$ is not a function". I've set up my codepen exactly how my site is. Is this a wordpress thing or GSAP thing or a me thing? Thank you for your help

Hi, I remember skimming over something that said that theres a function or something of that sort, that finalises tweens if they're quickly scrolled past? Could some one please remind me of the correct term please. Thanks

Thank you for your help. I didn't consider that a fixed element could not be a trigger . Thanks And - "And why were you setting the height to something invalid like this?:" That was an accident, I was playing around with ideas and must've accidentally hit save.

Hi, on my website, I have a slider that changes height, so when it's clicked the footer is cut off. So I made a small demo. When I click the button, the fixed .box in the background scroll triggers reset. So it fades back in. How can I make it so it when I click the button that triggers the ScrollTrigger refresh, the .box div isn't affected? I've tried, toggleActions, and invalidateOnRefresh: false Thank you for any help

Thank you!

Perfect! Thank you all for your help!

Thanks, I tried that a few days ago, but I couldn't figure out how to add the roatation