Comment la position de 400 x 400px popup div par rapport à cliquer, en gardant en vue de l'écran de

De préférence avec jQuery car il est beaucoup plus facile à comprendre.

Le suivant fonctionne très bien pour l'horizontale. La question est verticale peut être coupée sur le dessus pour demander à l'utilisateur de faire défiler jusqu'à voir l'ensemble de la popup.

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";}
    }

Puis-je charger quelque chose comme

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

OriginalL'auteur TrailDEX | 2011-01-28

  1. 1

    Il devrait être assez simple

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

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

    jquery:

    obtenir un décalage de l'élément parent , je veux dire, cliquez sur l'élément

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

    Cela devrait le faire.

    pouvez ajouter un peu de pixel en haut et à gauche
    mais si il le fait sur le bord de l'écran, il ne pourra pas tout voir, il en veut à calculer si c'est sur l'écran et si elle ne l'est pas, position.

    OriginalL'auteur kobe

  2. 0

    Quelque chose comme cela devrait fonctionner:

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

});

    OriginalL'auteur codelove