Bestimmen der Bildabmessungen mithilfe von JavaScript

Müssen Sie programmgesteuert auf die Abmessungen eines auf Ihrer Webseite angezeigten Bildes zugreifen? JavaScript bietet eine einfache Lösung.

Lösung:

JavaScript bietet einen unkomplizierten Ansatz zum Abrufen von Bildabmessungen:

1. Erstellen Sie ein neues Bildobjekt:

   const img = new Image();

2. Stellen Sie den Onload-Ereignis-Listener so ein, dass er die Bildabmessungen erfasst, sobald es verfügbar ist:

   img.onload = function() {
     alert(this.width   'x'   this.height);
   }

3. Bild laden:

   img.src = 'http://www.google.com/intl/en_ALL/images/logo.gif';

Beim Laden des Bildes wird das Onload-Ereignis ausgelöst und zeigt die Breite und Höhe des Bildes in einem Warnfeld an. Mit dieser Technik können Sie ganz einfach auf die Größe jedes Bildes auf Ihrer Webseite zugreifen.