Metod height

Metod height omogućava dobijanje i promenu visine elementa. Važno je zapamtiti, da ćemo dobiti 'izračunatu vrednost' visine (computed height). Za razliku od metoda css('height'), on vraća bezdimenzionu veličinu (na primer 400) i pogodan je za matematička izračunavanja. Metod dobija visinu sadržaja elementa, nezavisno od navedenog CSS-svojstva box-sizing. Da bismo izbegli nepotrebna izračunavanja, preporučuje se korišćenje css('height'). Greške u izračunavanju mogu takođe nastati, ako korisnik menja veličine stranice, kao i, ako je element ili njegov roditelj sakriven. Vrednost visine ne uzima u obzir vrednosti paddinga i bordera.

Sintaksa

Dobijanje visine elementa. U nekim slučajevima dobijene vrednosti mogu biti decimalne:

javascript$(selektor).height();

Da bismo promenili visinu elementa - možemo proslediti samo broj (na primer 400), tada će jedinica merenja biti pikseli, ili string, sa naznačenom jedinicom merenja (na primer '10em'):

javascript$(selektor).height(nova vrednost);

Takođe možemo primeniti zadatu funkciju na svaki element u skupu. Pritom će funkcija kao prvi parametar dobiti redni broj elementa u skupu, a kao drugi parametar - trenutnu vrednost zadate visine za konkretni element. this unutar funkcije će pokazivati na trenutni element.

Vrednost visine elementa će se promeniti na onu koju vrati funkcija:

javascript$(selektor).height(function(redni broj u skupu, trenutna vrednost visine));

Primer

Hajde da pri kliku na #test promenimo mu visinu na vrednost 30px, koristeći metod height, a takođe pomoću css promenimo mu pozadinu u zelenu:

html<div id="test"></div>

css#test {
  width: 50px; 
  height: 90px;
  background: red; 
  color: white;
  margin-top: 10px; 
  cursor: pointer;
}

javascript$('#test').one('click', function() {
  $(this).height(30).css({
    cursor: 'auto',
    backgroundColor: 'green'
  });
});

Pogledajte takođe