Korisna Javascript skripta za proveru širine ili visine viewporta browsera korisnika

Pozdrav svima

Pre izvesnog vremena sam radio na jednom projektu gde sam imao potrebu da prikazujem dodatne helper elemente u relativnoj poziciji u odnosu na input za koji su bili vezani.

Pošto je na širim rezolucijama bilo moguće pozicionirati helper element u desnom od input elementa, trebao mi je način da kroz jednostavnu JS skriptu proveravam širinu viewport-a samog browsera i da na taj način odredim da li će biti pozicionirano desno od input polja ili ispod(na mobile uređajima…).

Ovo je skripta:

function viewportSize(side) { 
  var w = window, 
      d = document, 
      e = d.documentElement, 
      g = d.getElementsByTagName('body')[0], 
      x = w.innerWidth || e.clientWidth || g.clientWidth, 
      y = w.innerHeight|| e.clientHeight|| g.clientHeight;

    return side === 'width' ? x : y;

}

Upotreba je vrlo jednostavna:

viewportSize('height');

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>