Wie kann ich die Originalbildabmessungen trotz Browser-Größenänderung ermitteln?

Browserübergreifende Bestimmung der Originalbildabmessungen

Die Bestimmung der Originalgröße eines Bildes, dessen Größe auf der Clientseite geändert wurde, kann a Herausforderung aufgrund von Browser-Inkonsistenzen. Es gibt jedoch ein paar zuverlässige, Framework-unabhängige Optionen, die Sie in Betracht ziehen können:

Option 1: Attribute entfernen und Offsets lesen

Entfernen Sie die Breiten- und Höhenattribute aus das Bild-Tag. Dadurch können Sie die Eigenschaften offsetWidth und offsetHeight lesen, um die tatsächlichen physischen Abmessungen des Bildes zu erhalten.

Option 2: JavaScript-Bildobjekt erstellen

Erstellen Sie ein JavaScript-Bildobjekt und setzen Sie sein src-Attribut auf die Bildquelle. Lesen Sie dann die Breiten- und Höheneigenschaften des Objekts. Sie müssen das Bild nicht zur Seite hinzufügen, damit diese Methode funktioniert. Hier ist eine Beispielfunktion:

<code class="html">function getImgSize(imgSrc) {
    var newImg = new Image();

    newImg.onload = function() {
      var height = newImg.height;
      var width = newImg.width;
      alert ('The image size is '+width+'*'+height);
    }

    newImg.src = imgSrc;
}</code>

Hinweis: Wie in den Kommentaren erwähnt, ist es wichtig, die Funktion beim Onload-Ereignis des Bildes auszuführen, um sicherzustellen, dass das Bild vorher vollständig geladen ist Ich versuche, seine Dimensionen zu lesen.

Das obige ist der detaillierte Inhalt vonWie kann ich die Originalbildabmessungen trotz Browser-Größenänderung ermitteln?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!