如何相对于点击定位400 x 400px popup div，保持在屏幕视图中

最好使用jQuery，因为它更容易理解。

以下工作非常适合水平。 问题是垂直可以在顶部切断，要求用户向上滚动以查看整个弹出窗口。

function pop_IT(X,event){ dist_to_right_edge = $('body').innerWidth()-(x-$.scrollbarWidth()); dist_to_bottom = $(window).height()-y; X=$('#'+X).get(0); X.style.left = 5+x+"px"; X.style.top = 5+y+"px"; if(dist_to_right_edge < (X.offsetWidth+5)){X.style.left = x - X.offsetWidth-5+"px";} if(dist_to_bottom < (X.offsetHeight+5)){X.style.top = y - X.offsetHeight-5+"px";} } 

然后我加载类似的东西

 $('#object').load('../whatever.php',function(event){pop_IT('object',event);}); 

Answer 1

它应该很简单

 
 test
 .popup { position:absolute; width:400px; height:400px; } 

jQuery的：

获取父元素的偏移量，我的意思是单击元素

 $("#yourclickdiv").click(function (e) { var offset = $(this).offset(); $(#popup).css('left',offset.left); $(#popup).css('top',offset.top); }); 

这应该做到这一点。

Answer 2

像这样的东西应该工作：

 $(document).click(function (e) { var x = e.clientX, y = e.clientY, width = $(window).width(), height = $(window).height(); if( x > width - 400 ) x -= 400; if( y > height - 400 ) y -= 400; $('#popup').css({'top':y,'left':x}); });