Jump to content
GreenSock

Anderw

errors found in the console

Recommended Posts

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

also the following warnings come out in the console, I have consulted and studied practically the whole forum but nothing

Screenshot (7).png

Link to comment
Share on other sites

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. 

  • Like 1
Link to comment
Share on other sites

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

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

I was aware of this but despite putting the correct name the error remains

Screenshot (8).png

Link to comment
Share on other sites

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

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

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

thank you for your support and your availability
Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×