jquery - 如何使弹出div锁定到jQuery中的页面坐标

Question

在 Stack Overflow 页面上，大多数弹出式 div 都“粘附”到当前页面坐标，因此如果您向上/向下滚动屏幕，弹出窗口仍然粘附到被单击的元素。我怎样才能做到这一点？

我目前所拥有的是当我点击按钮时出现弹出窗口，但是当我向上/向下滚动页面时，元素仍然粘在窗口屏幕上，而不是页面坐标。我怎样才能让它以 Stack Overflow 的方式工作，这样弹出的 div 就会粘到页面坐标上？

我当前对该元素的代码是

$(".userinfo").offset({ top: position.top + 60, left: position.left});

div的css位置明显是绝对的

Answer 1

听起来像是将弹出式 div 附加到主 html 窗口，因此它的行为类似于 position:fixed。如果您希望弹出窗口像您所说的那样“粘附”到按钮位置，则需要将其附加到 <div class="button"> 中。 (或任何你拥有的)元素。

<div class="main-container">
    <div class="button">
        <div class="userinfo></div> // Here's where you need to put your '.userinfo' class in
    </div>
</div>

和jQ:

$('.userinfo-main').appendTo('div.button');

这将使它定位在您的 <div class="button"> 中因此“粘”到它的坐标，而不是主屏幕。

希望对您有所帮助。