Context menu jumps to the top of the screen

Hi,

I've been experiencing an issue where the context menu jumps to the top of the screen if the menu goes off the visible screen at the bottom. I've got the menu tied to rows in a DataTable that sits at the bottom the page. This is especially noticeable on a mobile device where screen real-estate is limited.

When the issue occurs I can see that the top position of the menu has been reset to 0px and the left position has remained the expected value. A screenshot of what I'm seeing (num. 1 shows approx. where the mouse click occurred and num. 2 shows where the menu jumped to): ContextMenuPosition

The issue appears to occurs in when the activated operation is performed with the following code: https://github.com/swisnl/jQuery-contextMenu/blob/2ae293cb2eb76e84a436e4a3eff0e2458c234475/src/jquery.contextMenu.js#L1591-L1595

Unless I'm missing something here, I'm not sure why the top value is being set to winScrollTop if we're going out of bounds at the bottom of the screen. That makes sense if we go above the top of the visible window, but not below.

I've fixed my issue by changing the following from:

} else if(($menuOffset.top < winScrollTop) || ($menuOffset.top + menuHeight > winScrollTop + winHeight)){ 
     $menu.css({ 
         'top': winScrollTop + 'px' 
     }); 
}

} else if($menuOffset.top < winScrollTop){
     $menu.css({ 
         'top': winScrollTop + 'px' 
     }); 
} else if($menuOffset.top + menuHeight > winScrollTop + winHeight){
     $menu.css({
          'top': $menuOffset.top - (($menuOffset.top + menuHeight) - (winScrollTop + winHeight)) + "px"
     });
}

That seems to do the trick for me and instead of the menu jumping to the top, it's moved up by the number of pixels it went out of bounds by.

swisnl / jQuery-contextMenu

Context menu jumps to the top of the screen #749