Waypoints.js with wordpress

2019-03-03 11:36发布

问题:

I'm developing a wordpress site and I need to trigger the user scroll in order to fire different events and hide/show some images, so Waypoints.js is perfect for it.

However I've tried different attempts to make it work with no results. I add it as a function on functions.php file, like this:

function waypoints_method() {
    wp_deregister_script('jquery');
    wp_register_script('jquery', "http" . ($_SERVER['SERVER_PORT'] == 443 ? "s" : "") . "://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js", false, null);
    wp_enqueue_script('jquery');
    wp_enqueue_script('waypoints', get_stylesheet_directory_uri() . '/vendor/waypoints/lib/jquery.waypoints.min.js');
}
add_action( 'wp_enqueue_scripts', 'waypoints_method' );

And then in the javascript:

jQuery(document).ready(function($) {
     $('.waypoint').waypoint(function() {
            alert('You have scrolled to my waypoint.');
        });
}

The only thing I get it is to console.log when resizing the browser. So, what I need to do in order to make it work? Or, there is any alternative to Waypoints.js that I could use?

Thanks!

回答1:

Waypoints is using $ to access jQuery, but with WordPress you need to refer to jQuery as jQuery.

I found that I had to use the no framework version of Waypoints to get it working with WordPress.