JQuery-de ýerleşdiriş

JQuery-de elementleriň koordinatalary bilen işlemek üçin position we offset metodlary bar.

Bu metodlar elementleriň häzirki koordinatalaryny almak ýa-da üýtgetmek üçin hyzmat edýär we netije hökmünde top we left aýratynlyklaryny öz içine alýan bir obýekti gaýtarýar.

Ulanyjy sahypanyň ölçeglerini üýtgedende hasaplamalarda ýalňyşlyklar ýüze çykyp bilýär. Şeýle hem, metodlar gizlenen elementleriň koordinatalaryny almaz.

offset metody elementiň dokumente degişliligine görä pozisiyasyny alýar, position metody bolsa elementiň ata-enesiniň indentation-laryna degişliligine görä pozisiyasyny alýar.

Geliň, bizde aşakdaky HTML kody bolsun:

<div id="parent">
<p id="test">text</p>
</div>
<p id="text1"></p>
<p id="text2"></p>

Abzaslara CSS stilleri birikdirilýär:

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

Geliň, test düwüminiň pozisiyasyny bu metodlar bilen alyň we alynan obýektiň açarlaryna ýüz tutup, bu maglumatlary aşakdaky abzaslara çykaraýalyň:

let 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
);