⊗jqDmOwOhM 68 of 113 menu

jQuery outerWidth ja outerHeight meetodid

Viimane meetodite paar - outerWidth ja outerHeight, mille abil on võimalik saada elemendi laius ja kõrgus koos kõigi polsterduste ja piiridega, aga võib ka mitte arvestada väliseid polsterdusi margin.

Vaatleme näidet. Olgu meil lõik:

<p id="test">text</p> <p id="out"></p>

CSS näeb välja selline:

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

Saame lõigu #test laiuse ja kõrguse väärtused, arvestades sisemisi polsterdusi ja piire. Selleks tuleb neile meetoditele edastada false või jätta sulud tühjaks (kuna see on meetodis vaikimisi seatud):

let w = $('#test').outerWidth(false); let h = $('#test').outerHeight(); $('#out').text('Width: ' + w + ' Height: ' + h);

Nüüd erinevad meie väärtused veel 4px võrra, kuna piiride paksus on mõlemal küljel 2px.

Nüüd saame lõigu #test laiuse ja kõrguse väärtused, arvestades kõiki polsterdusi ja piire. Selleks tuleb meetoditele outerWidth ja outerHeight edastada true:

let w = $('#test').outerWidth(true); let h = $('#test').outerHeight(true); $('#out').text('Width: ' + w + ' Height: ' + h);

Nüüd erinevad meie väärtused eelmistest veel 20px võrra, kuna meil on välised polsterdused mõlemal küljel 10px.

Täiendage eelmiste ülesannete lahendust - väljastage kolmandasse lõiku divi #wrapper all divi #wrapper laiuse ja kõrguse väärtused - koos sisemiste polsterduste ja piiridega, kuid ilma väliste polsterdusteta. Neljandasse lõiku väljastage divi #wrapper laiuse ja kõrguse väärtused koos kõigi polsterduste ja piiridega.

Samuti saame meetodite outerWidth ja outerHeight abil muuta elementide laiuse ja kõrguse väärtusi. Näiteks määrame divi #test1 laiuse võrdseks 250px ja divi #test2 kõrguse - 200px:

$('#test1').outerWidth(250, true); $('#test2').outerHeight(200);

Kõik elemendi mõõtmetega töötamise meetodid sisaldavad ka võimalust rakendada funktsiooni igale elemendile komplektis.

Eesti
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
Me kasutame saidi toimimiseks, analüüsi ja personaliseerimiseks küpsiseid. Andmete töötlemine toimub vastavalt Privaatsuspoliitikale.
nõustu kõigega häälesta keeldu