Wordpress在鼠标滚轮上加载下一页

I want to implement this page in Wordpress: http://www.spendeeapp.com/
Basically, the loading next post on mousescroll functionality

I can replicate the mousescroll action thru jQuery

$(document).ready(function(){
    $(document)
        .on('mousewheel DOMMouseScroll swipedown swipeup', function(){
            // Do something
        })
});

PHP:

<div id="content">
            <h1>Main Area</h1>
            <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
                <h1><?php the_title(); ?></h1>
                <h4>Posted on <?php the_time('F jS, Y') ?></h4>
                <p><?php the_content(__('(more...)')); ?></p>
                <hr> <?php endwhile; else: ?>
                <p><?php _e('Sorry, no posts matched your criteria.'); ?></p><?php endif; ?>
        </div>

My question is, how can I load the next post thru the event, and display the loaded post.

You are already halfway there. All you need to do next is create an ajax request and load the next page by using a php callback. The code will look something like this. Pay special attention to comments.

jQuery

$.ajax({
    url: data.ajax_url, // Localize this variable using Wordpress functions
    type: 'post',
    data: {
        action: 'load_nextpage_page', // The name of php callback (function)
        // Any other variables you may wish to pass
    },
    success: function(data) {
        console.log(data);
        // Here you can use the data returned by you PHP callback
    }
});

PHP

<?php 

// your-javascript-file-handle is the one you use while enqueuing your JS files in wordpress. Use the same handle in following code
// to know more about localization visit https://developer.wordpress.org/reference/functions/wp_localize_script/

wp_localize_script('your-javascript-file-handle', 'data', array(
    'ajax_url' => admin_url('admin-ajax.php'),
));


// AJAX callback handling
add_action('wp_ajax_load_nextpage_page', 'load_nextpage_page');
add_action('wp_ajax_nopriv_load_nextpage_page', 'load_nextpage_page');

function load_nextpage_page()
{
    // Code for fetching next post here
    // Remember you will need a variable to keep track of which post should be fetched next.


    // Once you have fetched the right post
    //  you can echo the contents which will be passed as a reposnse to your ajax request.
}

I have outlined everything you might need to build this thing. I hope it helps you.