comment obtenir le bon décalage d'un élément? - jQuery

C'est probablement une question très simple, mais comment puis-je obtenir le bon décalage d'un élément dans jQuery?

Je peux faire:

$("#whatever").offset().left;

et c'est valable.

Mais il semble que:

$("#whatever").offset().right 

n'est pas défini.

Alors, comment peut-on accomplir cela dans jQuery?

Merci!!

Alex, Gary:

Comme demandé, voici mon commentaire posté comme réponse:

var rt = ($(window).width() - ($whatever.offset().left + $whatever.outerWidth()));

Merci de me le faire savoir.

En pseudo-code qui peut être exprimé comme:

Le bon décalage est:

La largeur de la fenêtre MOINS
(Le décalage gauche de l'élément PLUS la largeur extérieure de l'élément )

var $whatever        = $('#whatever');
var ending_right     = ($(window).width() - ($whatever.offset().left + $whatever.outerWidth()));

Référence: .outerWidth ()

Je ne comprends peut-être pas votre question, mais le décalage est censé vous donner deux variables: une horizontale et une verticale. Ceci définit la position de l'élément. Donc, ce que vous recherchez, c'est:

$("#whatever").offset().left

et

$("#whatever").offset().top

Si vous avez besoin de savoir où se trouve la bonne limite de votre élément, vous devez utiliser:

$("#whatever").offset().left + $("#whatever").outerWidth()

Juste un ajout à ce que Greg a dit:

$ ("# peu importe"). offset (). left + $ ("# peu importe"). externalWidth ()

Ce code obtiendra la bonne position par rapport au côté gauche. Si l'intention était d'obtenir la position du côté droit par rapport à la droite (comme lors de l'utilisation de la rightpropriété CSS ), un ajout au code est nécessaire comme suit:

$ ("# parent_container"). innerWidth () - ($ ("# peu importe"). offset (). left + $ ("# peu importe"). externalWidth ())

Ce code est utile dans les animations où vous devez définir le côté droit comme ancre fixe lorsque vous ne pouvez pas définir initialement la rightpropriété dans CSS.

En fait, ils ne fonctionnent que lorsque la fenêtre ne défile pas du tout à partir de la position supérieure gauche.
Vous devez soustraire les valeurs de défilement de la fenêtre pour obtenir un décalage utile pour repositionner les éléments afin qu'ils restent sur la page:

var offset = $('#whatever').offset();

offset.right = ($(window).width() + $(window).scrollLeft()) - (offset.left + $('#whatever').outerWidth(true));
offset.bottom = ($(window).height() + $(window).scrollTop()) - (offset.top + $('#whatever').outerHeight(true));

Il existe une API DOM native qui permet d'atteindre cet objectif hors de la boîte - getBoundingClientRect:

document.querySelector("#whatever").getBoundingClientRect().right

Brendon Crawford a eu la meilleure réponse ici (en commentaire), donc je vais passer à une réponse jusqu'à ce qu'il le fasse (et peut-être développer un peu).

var offset = $('#whatever').offset();

offset.right = $(window).width() - (offset.left + $('#whatever').outerWidth(true));
offset.bottom = $(window).height() - (offset.top + $('#whatever').outerHeight(true));

Obtenir le point d'ancrage d'un div/table (left) = $("#whatever").offset().left;- ok!

Obtenir le point d'ancrage d'un, div/table (right)vous pouvez utiliser le code ci-dessous.

 $("#whatever").width();