Bagaimana untuk Menentukan Saiz Imej Asal Selepas Mengubah Saiz Sebelah Klien Merentasi Pelayar?

Menentukan Pelayar Silang Saiz Imej Asal

Menentukan dimensi fizikal asal bagi imej yang telah diubah saiznya pada sisi klien boleh menjadi cabaran merentas pelayar. Walau bagaimanapun, terdapat kaedah yang boleh dipercayai dan bebas rangka kerja untuk mencapai ini:

Pilihan 1: Bacaan Dimensi Imej Dinamik

Alih keluar sebarang atribut lebar dan ketinggian yang dipratentukan daripada HTML imej unsur. Sistem akan melaraskan dimensi secara automatik agar sesuai dengan keperluan paparan. Selepas itu, gunakan JavaScript untuk mengakses sifat offsetWidth dan offsetHeight elemen, yang mewakili saiz lebar dan ketinggian yang diubah suai.

Pilihan 2: Objek Imej JavaScript

Buat objek Imej JavaScript dan tetapkan sumber imej yang diubah saiznya kepada sifat srcnya. Setelah imej dimuatkan, sifat lebar dan ketinggian objek akan memegang dimensi asal. Anda boleh menggunakan acara onload untuk melaksanakan operasi ini secara tidak segerak, memastikan imej dimuatkan sepenuhnya sebelum mendapatkan semula dimensi.

Contoh Kod:

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; // Do this after setting `onload`
}

Nota: Jika anda menghadapi masalah dengan imej besar yang tidak mengembalikan dimensi, pertimbangkan untuk menggunakan acara onload dalam objek JavaScript. Ini memastikan bahawa imej telah dimuatkan sepenuhnya sebelum mengakses sifatnya.

Atas ialah kandungan terperinci Bagaimana untuk Menentukan Saiz Imej Asal Selepas Mengubah Saiz Sebelah Klien Merentasi Pelayar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!