Adakalanya kita menginginkan suatu objek background(Form, Table,
textarea, body, dll) bisa berubah-rubah warna saat mouse berada pada
objek tersebut(mouse hover) dan berubah warna lagi saat mouse keluar dari objek tersebut(Mouse out). Tentunya kita bisa melakukan hal ini dengan menggunakan kode javascript, untuk itu bagaimana langkah-langkah Cara Mengubah Warna Background Dengan Javascript berikut kita simak bersama-sama.
Oke, pada contoh dibawah ini kita akan mengubah warna background sebuah table, warna background akan berubah pada saat mouse hover dan akan berubah warna lagi pada saat mouse out.
Live Demo :
Contoh selanjutnya kita akan mengubah warna background halaman website pada saat sebuah button di klik
Live Demo
Klik disini
Dan selanjutnya silahkan di kembangkan sendiri sesuai keinginan dan kreatifitas masing-masing.
Informasi mengenai sejarah singkat dan fungsi-fungsi javascript bisa di baca pada artikel Apa Itu JavaScript(Tentang JavaScript)
Oke, pada contoh dibawah ini kita akan mengubah warna background sebuah table, warna background akan berubah pada saat mouse hover dan akan berubah warna lagi pada saat mouse out.
1
2
3
4
5
6
7
8
9
10
11
| <html> <head> </head> <body> <table border=1 width=500 bgcolor= "blue" > <tr> <td onmouseover= "this.bgColor='green' " onmouseout= "this.bgColor='blue' " >Example</td></tr> <tr> <td onmouseover= "this.bgColor='green' " onmouseout= "this.bgColor='blue' " >Example2</td> </tr></table> </body></html> |
Example |
Example2 |
1
2
3
4
5
6
7
8
9
| <html> <head> <script> function change(){document.bgColor= "lightgreen" ;} </script> </head> <body> <input type= "button" onclick= "change()" value= "change" > </body></html> |
Klik disini
Dan selanjutnya silahkan di kembangkan sendiri sesuai keinginan dan kreatifitas masing-masing.
Informasi mengenai sejarah singkat dan fungsi-fungsi javascript bisa di baca pada artikel Apa Itu JavaScript(Tentang JavaScript)