jquery - jquery滚动悬停div的高度

Question

我有一个 wordpress 循环。每篇文章都有“.post”类。对于每个 .post，我都有一个带有“.skip”类的按钮。单击按钮时，我希望页面滚动到循环中的下一个 .post 。

我正在使用这个

$(function(){
    $(window).scroll(function(){
        $(".post").each(function(){
            var height = $(".post").height();
            var scroll = $(window).scrollTop();
            $(".skip").click(function(){
                $(window).scrollTop(scroll+height);
            });
        });
    });
});

有些事情已经完成，但不是它应该做的！

我的意思是..页面在点击时滚动，但第一个 .post 的高度（无论 .post .skip 按钮属于什么）

帮助！

wp 循环中的 .post 容器

<article <?php post_class(); ?>>
    <div class="skip">skip</div>
    <?php if ( has_post_thumbnail()) :  ?>
        <div class="container">
            <div>
                <?php the_post_thumbnail(); ?>
            </div>
        <h2 class="post-title"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
        </div>
    <?php else: ?> 
        <h2 class="post-title"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
    <?php endif; ?>
    <?php the_content(); ?>
    <a href="<?php the_permalink(); ?>" class="more">more</a>
</article>

Answer 1

$(function () {
    $(".skip").click(function () {
        var height = $(this).parent('article').height();
        var scroll = $(window).scrollTop();
        $(window).scrollTop(scroll + height);
    });
});

Answer 2

你应该试试这个

$(function(){
    $(window).load(function(){
        $(".post .skip").click(function(){
            var height = $(this).parent(".post").height();
            var scroll = $(window).scrollTop();

            $(window).scrollTop(scroll+height);
        });
    });
});

您不能在单击事件回调之外初始化 var "scroll"，但是这将为 0（初始顶部滚动：页面顶部 = 0）。