How to position 400 x 400px popup div relative to click, keeping in screen view

Question

Preferably with jQuery since it\'s so much easier to understand.

The following works great for horizontal. The issue is vertical can be cut off on top requiring the

Answer 1

Something like this should work:

$(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});

});

Answer 2

It should be pretty simple

<div class="popup" > test</div>

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

jquery:

get offset of the parent element , i mean click element

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

This should do it.