Jquery中的动态滚动位置

时间:2013-08-21 12:19:25

标签: jquery html css

请帮我解决以下问题

我有3个页面,用户滚动到第二页时滚动页面,它必须找到特定的ID,然后触发一个功能。一旦第三页开始另一个功能触发。 根据要求,我不应该使用任何插件

<script>
    $(window).on("scroll", function() {
        var offset = $("#two").offset();
        var posY = offset.top - $(window).scrollTop();
        if (offset.top + $("#two").height() > $(window).scrollTop()) {
            apply();
        } else {
            remove();
        }
</script>
<body>
    <div id="one"></div>
    <div id="two"></div>
    <div id="three"></div>
</body>

1 个答案:

答案 0 :(得分:3)

有一个很棒的插件,名为 WAYPOINT

我在 jsfiddle check it out

上设置了一个示例

<强> HTML

<div class="first"></div>
<div class="second"></div>

<强> CSS

.first {
    background:green;
    height: 600px;
    width:100%;
}
.second {
    background:red;
    height: 600px;
    width:100%;
}

<强> JS

$('.second').waypoint(function() {
    alert('You have scrolled to an entry.');
}, {
    offset: '100%'
});