Anderw Posted May 3, 2022 Share Posted May 3, 2022 Hello everyone I'm new in Gsap. I have integrated into my wordpress theme the related scripts that I needed, but they don't seem to work perfectly, any help would be useful,thank you very much these are the inclusions of the scripts: if ( ! function_exists( 'New_scripts' ) ) { function New_scripts() { wp_enqueue_script( 'New-gsap', get_template_directory_uri() . '/js/gsap.min.js', array( 'jquery' ),null,true ); wp_enqueue_script( 'New-ScrollTrigger', get_template_directory_uri() . '/js/ScrollTrigger.min.js', array( 'jquery' ),null,true ); wp_enqueue_script( 'New-ScrollToPlugin', get_template_directory_uri() . '/js/ScrollToPlugin.min.js', array( 'jquery' ),null,true ); wp_enqueue_script( 'New-CSSRulePlugin', get_template_directory_uri() . '/js/CSSRulePlugin.min.js', array( 'jquery' ),null,true ); wp_enqueue_script( 'New-script', get_template_directory_uri() . '/js/scripts.js', array( 'jquery' ),'', true ); if ( is_singular() && get_option( 'thread_comments' ) ) { wp_enqueue_script( 'comment-reply' ); } } } add_action( 'wp_enqueue_scripts', 'New_scripts' ); I've been trying for days I can't figure it out Link to comment Share on other sites More sharing options...
Anderw Posted May 3, 2022 Author Share Posted May 3, 2022 also the following warnings come out in the console, I have consulted and studied practically the whole forum but nothing Link to comment Share on other sites More sharing options...
mvaneijgen Posted May 3, 2022 Share Posted May 3, 2022 The only thing I can see from what you've shown is that the elements you are trying to animate are not on the page. GSAP target .image-content not found. This means there is no element called `.image-content` and that is correct your screenshot only has really big text, but no image. So it seems GSAP is working fine, but you're missing the HTML/PHP content to go with it. 1 Link to comment Share on other sites More sharing options...
Anderw Posted May 3, 2022 Author Share Posted May 3, 2022 actually exists as hero block, but it is part of this other code block, sorry but I have several, I give you the complete code of the error warnings See the Pen jOZEQqd by Andrewwolf (@Andrewwolf) on CodePen I am using action-created-blocks which allows me to create reusable code blocks for my works, they are displayed on the page but I don't understand why they don't work as they should Link to comment Share on other sites More sharing options...
GreenSock Posted May 4, 2022 Share Posted May 4, 2022 14 hours ago, Anderw said: actually exists as hero block, but it is part of this other code block, sorry but I have several, I give you the complete code of the error warnings It looks like you capitalized it in the markup, class="Image-content" but your animation code referenced ".image-content" which doesn't match. JavaScript is case-sensitive. Link to comment Share on other sites More sharing options...
Anderw Posted May 4, 2022 Author Share Posted May 4, 2022 I was aware of this but despite putting the correct name the error remains Link to comment Share on other sites More sharing options...
mvaneijgen Posted May 4, 2022 Share Posted May 4, 2022 Your issue is probably something to do with how the page is build. If you just use PHP there should be no issue with targeting HTML elements with GSAP. I've looked in to "action-created-blocks", but I can't find anything online about that. I have the feeling you are using some fancy plugin that loads your content via Javascript and thus your GSAP code is loaded before the elements are loaded. I recommend talking to support of your page builder or theme oir start by animating something simple and debug from there. Link to comment Share on other sites More sharing options...
Anderw Posted May 4, 2022 Author Share Posted May 4, 2022 is there any way to find out the order in which the gsap files are loaded? maybe discovering I can find a way to solve this problem! in other projects that I have used swup and locomotives this type of errors never happened to me, it almost seems that there is a conflict of css even if it is not! Link to comment Share on other sites More sharing options...
mvaneijgen Posted May 4, 2022 Share Posted May 4, 2022 It's probably not to do with you GSAP files as you can see they load fine in your console. It has to do with how the content is loaded and that is a mystery to us, because you're the only one that can see that. Again, ask your theme or page builder for support. Link to comment Share on other sites More sharing options...
Anderw Posted May 4, 2022 Author Share Posted May 4, 2022 thank you for your support and your availability Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now