popup-divをマウスカーソルの下に置くが、ウィンドウ内に完全に保持するにはどうすればよいですか？

Question

私は、マウスカーソルの下にpopup-divを表示しようとしていますが、それは完全に可視領域の内側にあるはずです。マウスカーソル下のdiv要素が働い表示：

この単純なアプローチの問題は、ポップアップdiv要素の一部が画面の外にあり得ることです。

Math.min(Math.max(0, lastClickPosition.pageY - (popupHeight/2)), 
     windowHeight - popupHeight - 20)+"px" 

しかしpageX/Yページと見えない部分に対してであるため、ページを下にスクロールされた後に、このアプローチは失敗します。だから私は、それが画面内に収まるようにするために最小と最大オフセットを計算してみました。

他のアイデアはありますか？

Answer 1

windowのscrollTopを追加する必要があります。垂直スクロール位置がスクロール 領域上記視界から隠さ された画素の数と同じである scrollTop

$(window).scrollTop(); // this is the scroll distance from the top 

参照。 .scrollTopスクロールバーが非常に 一番上にある、または要素がスクロール可能でない であれば、この数は0