Javascript jQuery文本突出显示菜单工作不正常

我有一个中等风格的文本突出显示菜单，如下所示，当您突出显示正文中的一段文本时，该菜单会起作用。我在前三段中做得很好。但是，当您向下滚动并选择文本时，菜单不会显示在正确的位置，而是显示在页面的顶部。如果有人能在这件事上提供帮助，我将不胜感激

HTML

getBoundingClientRect（）获取与窗口（仅页面的当前可见部分）相关的值，而不是与文档（整个页面）相关的值。 因此，它在计算其值时也会考虑滚动

更新此行：

top: ((p.top + window.scrollY) - menu.height() - 10),

$(function(){
  var menu = $('#highlight_menu');
  
  $(document.body).on('mouseup', function (evt) {
    var s = document.getSelection(),
      r = s.getRangeAt(0);
    if (r && s.toString()) {
      var p = r.getBoundingClientRect();
      if (p.left || p.top) {
        menu.css({
          left: (p.left + (p.width / 2)) - (menu.width() / 2),
          top: (p.top - menu.height() - 10),
          display: 'block',
          opacity: 0
      })
      .animate({
        opacity:1
      }, 300);
      
      setTimeout(function() {
        menu.addClass('highlight_menu_animate');
      }, 10);
      return;
    }
    }
    menu.animate({ opacity:0 }, function () {
      menu.hide().removeClass('highlight_menu_animate');
  });
  });
});

top: ((p.top + window.scrollY) - menu.height() - 10),