Skutečné rozměry obrázku

Jak může JavaScript zjistit skutečnou výšku a šířku obrázku.

22. srpna 2013

2 minuty

V novějších prohlížečích, než je Internet Explorer 8, lze použít obrazek.naturalWidth, respektive obrazek.naturalHeight.

<img src="logo.png" width=500 height=100 id=obrazek>

Ve starších prohlížečích lze využít načtení pomocného obrázku pomocí new Image() (podobně jako při testování, zda obrázek existuje).

function zjistitSkutecnyRozmer(obr) {
    var pomocnyObrazek = new Image();
    pomocnyObrazek.src = obr.src;
    return {
      sirka: pomocnyObrazek.width, 
      vyska: pomocnyObrazek.height
    };
  }

Použití:

var obrazek = document.getElementById('obrazek');
var skutecna = zjistitSkutecnyRozmer(obrazek);
alert(
  "Skutečná šířka: " + skutecna.sirka + 
  " a výška: " + skutecna.vyska
);