Question

我想在向下滚动操作期间禁用网页的垂直移动，只需触发动画即可此外，我想确保只有在传递一些指定的垂直位置后才会禁用它。这些是我页面中的两个部分。

 <section id="3" class="window">
        <div class="content">

            <button id="slide">slide</button>
           <img height="700" src="/home/varun/Documents/Crown/images/line.png" id="2guns" style="position:relative; left:1293px;                                                                                                                                 bottom: 50px;">
        </div>
    </section>
    <section id="4" class="window">
    <div class="content">
        </div>
    </section>

这是我给了sectio的Jquery：id：3

 $(window).scroll(function() {
var y_scroll_pos = window.pageYOffset;
var scroll_pos_test =2000;             

if(y_scroll_pos > scroll_pos_test) {
    $('#2guns'&&'#3').animate({left: -14600},7000);
}
});

这里，部分：id：3从2000px开始现在的问题是，在向下滚动到2000之后，我想禁用页面的垂直位移。

Answer 1

当用户滚动超过2000时，请提供section#3 position: fixed，以便它会跟随浏览器窗口。使用JS，使元素足够高以覆盖整个视口。用户将能够滚动，但他们不会看到任何不同的东西。当用户向上滚动回到2000以上时，将position从fixed更改为static。

将position的{{1}}设置为section#3：

fixed

使元素与浏览器窗口一样高：

$('#3').css('position', 'fixed'})

在某个指定的垂直位置后向下滚动时禁用页面的垂直位移

1 个答案: