jQuery-də Pozisioning

jQuery-də elementlərin koordinatları ilə işləmək üçün position və offset metodları var.

Bu metodlar elementin cari koordinatlarını almaq və ya dəyişmək üçündür və nəticə olaraq top və left xassələrini ehtiva edən bir obyekt qaytarır.

Hesablamalarda səhvlər yarana bilər, əgər istifadəçi səhifənin ölçülərini dəyişirsə. Həmçinin metodlar gizli elementlərin koordinatlarını almır.

offset metodu elementin mövqeyini sənəddən nisbətən alır, position isə elementin valideyninin boşluqlarından nisbətən mövqeyini alır.

Tutaq ki, bizim aşağıdakı HTML kodumuz var:

html<div id="parent">
<p id="test">mətn</p>
</div>
<p id="text1"></p>
<p id="text2"></p>

Abzaslara CSS stilləri əlavə edilib:

css#parent {
  width: 150px;
  border: 1px solid blueviolet;
}
#test {
  margin: 5px;
  text-align: center;
  outline: 1px solid green;
}

Gəlin test div-inin mövqeyini bu metodlarla alaq və alınan obyektin açar dəyərlərinə müraciət edərək, bu məlumatı aşağıdakı abzaslarda çap edək:

javascriptlet offset = $('#test').offset();
$('#text1').text(
  '(OFFSET()) left: ' + offset.left + ', top: ' + offset.top
);
let position = $('#test').position();
$('#text2').text(
  '(POSITION()) left: ' + position.left + ', top: ' + position.top
);