img.naturalWidth

[Matthias Scharwies]

Guten Morgen,

Im SELF-Wiki gibt es ein Beispiel zu images.naturalWidth

'use strict';
document.addEventListener('DOMContentLoaded', function () {
	document.querySelector('#auslesen')
		.addEventListener('click', analyseImage);

	function analyseImage() {
		let image = document.querySelector('img');
		document.querySelector('output')
			.textContent = ' Höhe:  ' + image.height + 'px \n' + ' Breite: ' + image.width +
			'px \n' + ' orig. Höhe:  ' + image.naturalHeight + 'px \n' +
			' orig. Breite: ' + image.naturalWidth + 'px \n';
	}
});

Dort ist der Code nicht weiter erklärt, funktioniert aber.

document.addEventListener('DOMContentLoaded',...) richtet einen EventListener ein, der das Laden des DOM abwartet - erst wenn die Webseite und damit auch das Bild geladen ist, kann man die naturalWidth ermitteln.
.addEventListener('click', analyseImage);ruft bei einem Klick auf den Button die Funktion analyseImage() auf.
Der Rest müsste selbsterklärend sein.

Ansonsten: JavaScript_und_das_DOM/Ereignisverarbeitung

Herzliche Grüße
Matthias Scharwies