Download Video Tutorial Web Bot Development
Halo... halo kembali di tutorial javascript. Kali ini saya coba menshare sebuah trik jquery yang lumayan bermanfaat untuk diimplementasikan ke dalam website atau blog milik Anda.
Pastinya Anda pernah mendapati website yang Anda akses maupun website milik Anda sendiri itu bermasalah ketika meload gambar. Biasanya masalah muncul karena Anda meletakkan gambar di tempat / hosting yang berbeda. Atau ketika Anda mengambil gambar dari website atau blog lain kemungkinan besar sudah dihapus gambarnya atau ada semacam restriksi sehingga Anda tidak bisa meload gambarnya untuk di tampilkan di website miliki Anda. Dan kemungkinan-kemungkinan lainnya berkaitan dengan gambar tidak bisa diakses.
Nah dari pada gambar yang diload tidak muncul, kadang hanya menyisakan ruang kosong yang akhirnya malah membuat layout website terlihat jomplang, kadang hanya muncul icon gambar yang terbelah menyesuaikan browser, intinya tidak enak dilihat lah. Lebih baik kita ganti saja dengan gambar pengganti, Anda bisa menggunakan gambar apapun, silahkan dipilih-dipilih.
Disini saya menyiapkan sebuah gambar bernama gbr.jpg, kemudian saya membuat sebuah script di mana didalamnya terdapat sebuah elemen img yang mana url pemanggilan gambarnya bermasalah. Yang nantinya secara otomatis diganti oleh script jquery. Baik ini adalah script lengkapnya ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<img src="https://www.ilmuwebsite.com/perpus/templates/frontend/perpus/images/header-logosss.png" onerror="imgError(this);" />
<script type="text/javascript">
function imgError(image) {
image.onerror = "";
image.src = "error-404.png";
return true;
}
</script>
</body>
</html>
Untuk melihat script demonya silahkan klik http://www.ilmuwebsite.com/labz/javascript/img-rusak.html
Selamat bereksperiment, semoga bermanfaat.