Metoda outerHeight

Metoda outerHeight lejon marrjen dhe ndryshimin e lartësisë së elementit duke përfshirë padding-un, border-in dhe në mënyrë selektive - margin-in e elementit. Është e rëndësishme të kujtohet se ne do të marrim 'vlerën e llogaritur' të lartësisë (computed height). Gabimet në llogaritje mund të ndodhin gjithashtu nëse përdoruesi ndryshon përmasat e faqes, si dhe nëse elementi ose prindi i tij janë të fshehur.

Sintaksa

Kështu mund të marrim lartësinë e elementit. Kjo metodë mund të marrë një parametër opsional në formën e true ose false (false është parazgjedhur), varësisht nëse do të përfshihen margin-et apo jo. Në disa raste vlerat e marra mund të jenë thyesore:

javascript$(selector).outerWidth([include_margin]);

Për të ndryshuar lartësinë e elementit - mund të kaloni thjesht një numër (për shembull 400), atëherë njësitë e matjes do të jenë piksel, ose një varg, me specifikimin e njësive të matjes (për shembull '10em'):

javascript$(selector).outerHeight(vlera e re, [include_margin]);

Gjithashtu ne mund të aplikojmë një funksion të caktuar për çdo element në grup. Në këtë rast, parametri i parë i funksionit do të marrë numrin e elementit në grup, dhe parametri i dytë - vlerën aktuale të lartësisë së caktuar për elementin specifik. this brenda funksionit do të tregojë elementin aktual. Vlera e lartësisë së elementit do të ndryshojë në atë që kthen funksioni:

javascript$(selector).outerHeight(function(numri në grup, vlera aktuale e lartësisë));

Shembull

Le të shfaqim informacionin për lartësinë e paragrafit #test, të marrë me metodat height, innerHeight dhe outerHeight për krahasim:

html<p id="test">tekst</p>
<p id="out1"></p>
<p id="out2"></p>
<p id="out3"></p>
<p id="out4"></p>

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

javascriptlet h1 = $('#test').height();
let h2 = $('#test').innerHeight();
let h3 = $('#test').outerHeight();
let h4 = $('#test').outerHeight(true);

$('#out1').text(h1);
$('#out2').text(h2);
$('#out3').text(h3);
$('#out4').text(h4);

Shihni gjithashtu