sebenarnya banyak sekali event dalam javascript, kali ini kita akan mencoba tentang event onmouseover dan bagaimana cara menggunakan event onmouseover ini, seperti biasa izinkan diri ini untuk mengucapkan
Salam sobat semua
Alhamdulillahi robbil 'alamiin atas segala nikmat yang telah Allah berikan pada diri ini secara gratis, sehingga diri ini bisa menulis dan berbagi dalam tulisan ini,tak lupa sholawat serta salamku akan tetap terpanjatkan hanya untuk junjungan baginda Sayyidina Muhammad ibni Abdillah beserta kepada keluarga dan para sahabatnya. dan seperti biasa juga sebelum kita memulainya mari kita bersama-sama membaca basmalah agar semua yang kita mulai sesuatunya diberi kemudahan dan kelancaran oleh Allah S.W.T.sehingganya tercapai seperti apa yang diharapkan kita semua.
Bismillahir rohmaanir rohiim, event onmouseover termasuk dari beberapa event dalam javascript dan juga sering dipakai dalam pembuatan website atau applikasi web programing.dan saya juga sering memakainya dulu dalam pembuatan kode javascript, sebenarnya masih banyak sekali event-event dalam javascript, tapi kita hanya mencoba dan mengetahui beberapa event-event yang penting penting saja. dan jika memang ingin tahu lebih banyak lagi kalian bisa lah untuk google di media website lain. atua nanti kalau ada waktu luang juga saya coba untuk mempelajari dan menulisnya di tulisan ini.event onmouseover ini kalau menurut versi saya adalah suatu keadaan atau kondisi dimana jika terjadi peletakan kursor pada suatu tag html maka akan kode javascript tereksekusi atau berjalan atau running. biasanya kalau saya memakai event onmouseover ini dalam tag image atau gambar. tapi diluar sana juga sering memakainya untuk menghentikan marquee atau tulisan yang berjalan di website menggunakan event onmouseover ini.
ada juga yang digunakan untuk mengubah gambar dengna menggunakan event onmouseover ini.tapi kali ini kita akan mencoba onmouseover event ini hanya dalam kode sederhana saja agar kira lebih mudah memahami dan dengan harapan nantinya bisa menerapkan dan mengembangkan ke dalam kode yang lebih expert. oke langsung saja kita buka text editor kesayangan kita masing-masing, dan kemudian ketikkan atau copy paste kode berikut dalam text editor kita.
<html><head><title>My Web</title><script>function outawaljs(){var outnya=document.getElementById("outjs1");outnya.innerHTML="<h2>Ini Javascript pertamaku</h2>";}function pesandialog(){window.alert("Tes refresh onload javascript");}</script><meta name="viewport" content="width=device-width, initial-scale=1.0"></head><body><img src="gambar/back1.jpg"></body><html>
sehingga kalau di load atau di run kode diatas hanya tampil muncul gambar
dan sekarang kita coba tambahkan kode event ini seperti berikut dalam kode diatas.
onmouseover="pesandialog()"
dan jika kalau kode lengkapnya seperti berikut ini
<html>
<head>
<title>My Web</title>
<script>
function outawaljs(){
var outnya=document.getElementById("outjs1");
outnya.innerHTML="<h2>Ini Javascript pertamaku</h2>";
}
function pesandialog(){
window.alert("Tes refresh onload javascript");
}
</script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<img src="gambar/back1.jpg" onmouseover="pesandialog()">
</body>
<html>
dan jika kita reload atau refresh tidak akan terjadi apa-apa lagi, tapi sekarang kita coba letakkan mouse atau kursor kita di atas gambar tersebut maka akan menghasilkan output seperti berikut
nah saya rasa untuk tulisan tentang apa event onmouseover dan bagaimana cara menggunakan event onmouseover cukup sampai disini dulu, dan kita akan lanjut di next tulisan Insya Allah dan mudah-mudahan tulisan ini bisa membawa dan memberikan manfaat bagi kita semua, Aamiiin.
Salam sobat semua
#javascript #html #free #share #event #mouseover #onmouseover #web #website #websites
Comments
Post a Comment