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');

Read More