Metod offset

Metod offset metodyndan tapawutlylykda, elementiň ýerleşişini dokumenta nisbeten almagy mümkinçilik berýär, position, koordinatalary ata elemente nisbeten alýar. Metod offset täze elementi bar bolan element üstüne ýerleşdirmekde, ýörite çözgütlerde, mysal üçin, süýşürmek (drag-and-drop) üçin has gerekli. Metod netijesi hökmünde, top we left aýratynlyklaryny öz içine alýan obyekty gaýtarýar. Ulanyjy sahypanyň ölçegini üýtgetse, hasaplamalarda ýalňyşlyklar ýüze çykyp bilýär. Şeýle hem metod gizlenen elementleriň koordinatalaryny alyp bilmeýär.

Sintaksis

Häzirki koordinatalary almak. Käbir wakalarynda alynan bahalar kesirli bolup bilýär:

$(selektor).offset();

Elementiň koordinatalaryny üýtgetmek üçin, top we left aýratynlyklaryny öz içine alýan obýekti geçirmeli:

$(selektor).offset({top: 40, left: 40});

Şeýle hem berlen funksiýany her elemente topardaky sanaw boýunça ulanyp bileris. Funksiýa birinji parametr hökmünde element sanawdaky tertip belgisini, ikinji parametr hökmünde bolsa top we left koordinatalaryny öz içine alýan obýekti alyar. Funksiýa içinde this häzirki elemente görkezer. Elementiň koordinata bahalary funksiýanyň gaýtaran bahalary bilen çalşylar:

$(selektor).width(funksiýa(tertip belgisi, {häzirki koordinatalar}));

Mysal

Metod offset arkaly dïwiň (ýaşyl kwadratyň) pozisiýasyny alalyň, soň bolsa alynan obýektiň açarlaryna ýüzlenip, bu maglumaty çykaryň:

<div id="result">kwadrata basyň ...</div>
<div id="test"></div>

#test {
	position: absolute;
	top: 40px;
	left: 40px;
	width: 100px;
	height: 100px;
	background: green;
	color: white;
	margin-top: 10px;
	cursor: pointer;
}

$('*', document.body).click(function(waka) {
	let offset = $(this).offset();
	
	waka.stopPropagation();
	$('#result').text('Çep: ' + offset.left + ', Ýokary: ' + offset.top);
});

Mysal

Ikinji abzasynyň koordinatalaryny üýtgeteliň:

<p style="margin-left: 10px;">tekst1</p>
<p style="margin-left: 10px;">tekst2</p>

$('p').last().offset({top: 40, left: 60});

Şeýle-de görmeli

metod position,
häzirki element koordinatalaryny alyp bilmek üçin
metod offsetParent,
elementiň iň ýakyn pozisionirlenmiş ata elementini almak üçin
metod css,
elementiň CSS stillerini almak we üýtgetmek üçin