javascript - 在不使用 CSS 的情况下使元素与浏览器屏幕顶部保持一定距离？

Question

我正在使用 Bootstraps 模态，因此添加 position:fixed 不起作用。

我有一个指向模态触发元素的箭头元素。我希望此箭头指向屏幕上任何位置的触发器。

我可以很容易地做到这一点:

$("[data-toggle='modal']").click(function() {
    triggerpos = $(this).offset().top;
    $('.modal-arrow').css('top', triggerpos + "px");
}); 

问题是如果有一个导致用户滚动的长模态框，那么箭头就不会保持固定；它随着用户滚动而移动。

查看我的 fiddle :https://jsfiddle.net/umv4jhLg/22/

当然我也尝试过用CSS进行各种安排，但都没有结果。

我也试过在窗口滚动时调整它:

$(window).scroll(function(){
  var triggerpos = $(this).offset().top;
    $('.modal-arrow').css('top', triggerpos + "px");  
})

但没有结果。

谁知道我可以使用 Jquery 保持 .modal-arrow 稳定的方法？

Answer 1

试试 .scrollTop()

将其添加到您的首位