Javascript not working with plugin

  • Resolved davidchapman1

    (@davidchapman1)


    4 years, 7 months ago

    Hi

    I have created my post landing page and styled it accordingly. Within my styles I have a couple of adddClass functions set. When I add the ajax load more plugin the addClass functions are not working. I have added these functions in the CMS setup for the template, within index.php and also in my javascript file which is loaded via the functions.php.

    Could you advise why javascript functions do not work with this plugin?

    Thanks

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Darren Cooney

    (@dcooney)

    @davidchapman1 THis makes sense because you’re adding the classes and Ajax Load More hasn’t loaded the content yet.

    There is a callback function we can use to add the classnames.

    I can help if you share your code.

    Let me know,

    Thread Starter davidchapman1

    (@davidchapman1)

    Hi Darren

    Thanks for the reply.

    the code is:
    $( “a.big-button” ).addClass( “hvr-sweep-to-top” );
    $( “.big-button a” ).addClass( “hvr-sweep-to-top” );
    $( “.blog-article-container:even” ).addClass( “background-blue” );

    I have found this is also not working on the first set of posts that load automatically, or are all posts loaded with a delay?

    If you can advise I would be grateful, this has been driving me mad all morning!

    I will take a look at the call back page

    Thanks

    Thread Starter davidchapman1

    (@davidchapman1)

    Hi Darren

    I have added:

    window.almComplete = function(alm){
    $( “.blog-article-container:even” ).addClass( “background-blue” );
    $( “a.more-link” ).addClass( “big-button” );
    $( “a.more-link” ).addClass( “hvr-sweep-to-top” );
    };

    Which is now working correctly.

    Many Thanks

    Plugin Author Darren Cooney

    (@dcooney)

    @davidchapman1

    Ok great, I’ll suggest one change tho. The way you’re doing it is running the function again on all posts. If you pass in alm.el to the functions it will only target the new posts. 

    window.almComplete = function(alm){
   $( ".blog-article-container:even", alm.el ).addClass( "background-blue" );
   $( "a.more-link", alm.el ).addClass( "big-button" );
   $( "a.more-link", alm.el ).addClass( "hvr-sweep-to-top" );
};

    This should work, but if it doesn’t just go with what you already had ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Javascript not working with plugin’ is closed to new replies.