jQuery-де позициялау

jQuery-де элементтердің координаттарымен жұмыс істеу үшін position және offset әдістері бар.

Бұл әдістер элементтің ағымдағы координаттарын алу немесе өзгерту үшін қолданылады және нәтиже ретінде top және left қасиеттерін қамтитын объект қайтарады.

Пайдаланушы бет өлшемдерін өзгерткенде есептеулерде қателер пайда болуы мүмкін. Сондай-ақ әдістер жасырын элементтердің координаттарын ала алмайды.

offset әдісі элементтің позициясын құжатқа қатысты алады, ал position әдісі элементтің позициясын ата-ананың шегіністеріне қатысты алады.

Бізде келесі HTML коды бар делік:

<div id="parent">
<p id="test">мәтін</p>
</div>
<p id="text1"></p>
<p id="text2"></p>

Абзацтарға CSS стильдері байланыстырылған:

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

Енді test дивінің позициясын осы әдістермен алайық және алынған объекттің кілттеріне сілтеме жасап, бұл ақпаратты төмендегі абзацтарға шығарайық:

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