Meetod innerWidth

Meetod innerWidth võimaldab saada ja muuta elemendi laiust arvestades selle sisemisi paddinguid. Oluline on meeles pidada, et me saame 'arvutatud väärtuse' laiusest (computed width). Arvutusvead võivad tekkida ka siis, kui kasutaja muudab lehe suurust, samuti kui element või selle vanem on peidetud. Laiuse väärtus ei arvesta elemendi piirjoone paksust.

Süntaks

Elemendi laiuse saamine. Mõnel juhul saadud väärtused võivad olla murdarvulised:

$(valija).innerWidth();

Elemendi laiuse muutmiseks - saab edastada lihtsalt arvu (näiteks 400), siis mõõtühikud on pikslid, või stringi, mõõtühikute määramisega (näiteks '10em'):

$(valija).innerWidth(uus vaartus);

Samuti saame rakendada antud funktsiooni iga elemendi jaoks valikus. Sel juhul saab funktsioon esimese parameetrina elemendi numbri valikus, ja teise parameetrina - praeguse laiuse väärtuse konkreetse elemendi jaoks. Väärtus this funktsiooni sees viitab praegusele elemendile. Elemendi laiuse väärtus muutub selleks, mida funktsioon tagastab:

$(valija).innerWidth(function(number valikus, praegune laiuse vaartus));

Näide

Võrdluseks kuvame info lõigu #test laiusest, mis on saadud meetoditega width ja innerWidth:

<p id="test">text</p>
<p id="out1"></p>
<p id="out2"></p>

p {
	margin: 10px;
	padding: 5px;
	border: 2px solid blue;
}

let w1 = $('#test').width();
let w2 = $('#test').innerWidth();

$('#out1').text(w1);
$('#out2').text(w2);

Me näeme erinevust 10px, mis on meie vasaku ja parema sisemise paddingu summa.

Vaata ka

meetod width,
mis võimaldab saada ja muuta elemendi laiust
meetod outerWidth,
mis võimaldab saada ja muuta elemendi laiust, arvestades selle paddinguid ja piirjoont