多个id的滚动功能

问题描述 投票：0回答：3

我有以下代码在滚动时将div粘贴到顶部：

$(window).scroll(function() {
//After scrolling 100px from the top...
if ( $(window).scrollTop() >= 72 || (w > 980)) {
    $('#div1').css('top', '0px');

//Otherwise remove inline styles and thereby revert to original stying
} else {
    $('#div1').attr('style', '');

}
});

现在我希望一个页面上的两个div具有相同的行为。我试过了：

 $('#div1' || '#div2')

但这似乎不起作用。我怎么能实现这个目标？

javascript scroll id
3个回答
2
投票

要么逗号将它们像$('#div1, #div2')分开，要么只添加一个类而不是像$('.stickyDiv')那样使用id然后

<div class="stickyDiv" id="div1></div>
<div class="stickyDiv" id="div2></div>
0
投票

如果您的目标是在滚动时将div粘贴在顶部，我建议您使用名为position的CSS属性。

示例：Codepen

你可以阅读更多关于它here。

0
投票

这可以通过position：sticky来实现。

#div1 , #div2 {
    position: sticky;
    top: 72px;
}

默认情况下，它们将表现为position：relative。 滚动父元素（通过72px点）时，它们的行为类似于position：fixed。

这只会在父元素的滚动中发生。 如果您希望它们相对于窗口是粘性的，请将它们作为<body>的直接子项放置。

<body>
    <div id="div1"></div>
    <div id="div2"></div>
</body>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.