jQuery: różnica między position () a offset()

Jaka jest różnica między position() A offset()? Próbowałem wykonać następujące czynności w przypadku kliknięcia:

console.info($(this).position(), $(this).offset());

I wydaje się, że wracają dokładnie takie same... (Kliknięty element znajduje się w komórce tabeli w tabeli)

Author: Svish, 2010-07-08

3 answers

To zależy od kontekstu, w jakim znajduje się element. position Zwraca pozycję względem elementu nadrzędnego offsetu, a offset robi to samo względem dokumentu. Oczywiście, jeśli dokument jest rodzicem offsetowym, co często ma miejsce, będą one identyczne.

Jeśli jednak masz taki układ:

 <div style="position: absolute; top: 200; left: 200;">
     <div id="sub"></div>
 </div>

Wtedy offsetdla sub będzie 200: 200, ale jego position będzie 0: 0.

 201
Author: David Hedlund,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-07-08 09:48:15

.metoda offset () pozwala nam pobrać aktualną pozycję elementu względem dokumentu . Porównaj to z .position () , która pobiera bieżącą pozycję względem offsetowego rodzica . Przy pozycjonowaniu nowego elementu na istniejącym do globalnej manipulacji (w szczególności do implementacji drag-and-drop),.offset() jest tym bardziej użyteczny.

Źródło: http://api.jquery.com/offset/

 28
Author: jAndy,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-07-08 09:02:58

Obie funkcje zwracają zwykły obiekt o dwóch właściwościach: szerokość i wysokość.

Offset() odnosi się do pozycji względem dokumentu.

Position() odnosi się do pozycji względem elementu nadrzędnego

Ale gdy pozycja css obiektu jest "absolutna", obie funkcje zwrócą width = 0 & height = 0

 -6
Author: dwoutsourcing,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-12-23 18:32:24