Ukuran gambar yang ditampilkan di browser mungkin bukan ketinggian dan lebarnya yang sebenarnya. Misalnya, seperti di bawah ini, kami akan menambahkan gaya lebar dan tinggi ke dalamnya.
<img src = "ie.png">
Ini menunjukkan ukuran di browser menjadi 25px. Jadi bagaimana kita mendapatkan ukuran gambar yang sebenarnya? , kode berikut mengimplementasikan fungsi ini
Salinan kode adalah sebagai berikut:
<! Doctype html>
<Html>
<head>
<meta http-equiv = "tipe konten" content = "text/html; charset = utf-8">
</head>
<body>
<img src = "ie.png" id = "image">
<script>
// atur penundaan untuk memastikan bahwa pemuatan gambar selesai
setTimeout (function () {
var
Real_width,
Real_height,
_im = document.geteLementById ('image'),
im = document.createElement ('img');
im.src = _im.src,
real_width = im.width,
real_height = im.height;
peringatan (real_width+'/n'+real_height);
}, 500);
</script>
</body>
</html>
Catatan: Saya telah menguji kode di atas pada IE7+ dan Chrome, karena saya tidak dapat mengujinya karena IE6 tidak diinstal.
Kode yang sangat berguna, saya menggunakannya di sebagian besar proyek, jangan ragu untuk menggunakannya