Question

我有像这样的HTML：

<div id="window">
  <p>Random length of text</p>
  <p>Random length of text</p>
  <p>Random length of text</p>
  <div id="comment"> input ...</div>
</div>

文字是随机的。我想要做的是，如果id =“comment”从页面滚动，例如在页面下方，那么我想添加一个“固定”类，这样我就可以确保id =“comment始终可见页面。

我尝试过类似的东西，但它不起作用......想法？

$('#comment').offset().top  
$('window').scrollTop()

Thaks

Answer 1

将Comment块定位为绝对http://www.w3schools.com/css/pr_class_position.asp，您可以在页面上随意放置它。然后，您可以绑定滚动事件，以便在人们更改页面时重新定位它。

Answer 2

你的意思是你想让评论div停留在屏幕的底部而与用户的滚动无关吗？因为这可以用CSS完成，即

#comment {
    position: fixed;
    bottom: 0;
}

或许您希望它坚持段落的底部，如果它们没有填满屏幕的整个高度？在这种情况下，您可以使用jQuery根据注释div的位置动态设置上述CSS规则，即

的jQuery

$(document).ready(function()
{
    bottom = $("#comment").position().top + $("#comment").height();
    if (bottom > $(window).height()) $("#comment").addClass("fixed-bottom");
});

CSS

.fixed-bottom {
    position: fixed;
    bottom: 0;
}

防止DIV低于折叠

2 个答案: