Cumulus swf - flash

Bru masuk angin!

Arsip...

Flag Counters

Flag Counter

Pengikut

Recent Comments plus Kode CSS Box Gelap

Recent Comments

blog-indonesia.com

Vertical Menu

CLICK any categories for open!
Gubhug Reyot

Sobat Ngeblogh

Sobat Ngeblogh

Buat sobat blogger yang mau ikutan jadi follower silahkan KLIK link Follower (Follow) di ujung kanan-bawah. Dari hasil monitoring, ternyata yang link-nya telah dimasukkan ke "Sobat Ngeblogh" mengalami pertambahan pengunjung secara signifikan!
Terima kasih .: Salam :.
gubhug reyot

Cara Membuat Hover pada Background Sidebar Widged

Tutorial BloGGeR dan Panduan BloGGeR tentang Widget :

Hover pada background berfungsi untuk merubah warna background ketika mouse berada di atas bagian tersebut. Sebagai contoh : pada saat kita melihat ada sesuatu yang menarik pada sebuah blog, ketika cursor belum kita arahkan ke bagian tersebut masih berwarna hitam (ini misalnya !), tetapi begitu cursor mulai menyentuh ruang pada bagian tersebut, secara tiba-tiba seluruh bagian ruang (kolom) tersebut menjadi berwarna biru tua, dan bahkan mungkin muncul garis tepi (border). Kondisi seperti ini bisa terjadi karena penggunaan "hover". Secara sederhana pengertian fungsi hover adalah merubah beberapa variable dalam blog/template ketika cursor berada di atas bagian tersebut. Variabel yang biasanya diterapkan sebagai hover adalah : background (baik background color ataupun background image), border, warna font, jenis font dan tebal font serta fungsi text decoration (pada link).

Cara untuk membuat Hover pada Background Sidebar Widged

  1. Login ke Blogger.
  2. Amankan Template (lihat di sini !).
  3. Tetap di Edit HTML kemudian cari KODE CSS :
  4. .sidebar .widget{ 
            margin: ...px;
            padding: ..px;
            ....
            ....
    }
  5. Tambahkan KODE CSS baru di bawah syntax tersebut seperti KODE di bawah ini :
  6. .sidebar .widget:hover{
            background:black;
    }
    sehingga bentuknya menjadi :
    .sidebar .widget{ 
            margin: ...px;
            padding: ..px;
            ....
            ....
    }
    .sidebar .widget:hover{
            background:black;
    }
    - Gantilah warna "black" dengan warna yang sesuai dengan warna font/teks pada blog anda !
  7. Jangan lupa KLIK Simpan Template !

Silahkan juga buka Tutorial lain yang sangat menarik dan patut di ikuti sampeyan semua. Akses melalui link di bawah ini :




» Happy Blogging - gubhugreyot «

4 komentar:

  1. Mantap abis nih layout blog Anda, Bung!
    Like this pisan euy.. :)
    Trims tutorialnya, GBU!

    BalasHapus
  2. Keren gan,makasih bgt infonya gan tolong FOLLOW blog ane di http://fanspage-muse.blogspot.com/

    BalasHapus
  3. Mantap boss
    http://onnetz.blogspot.com

    BalasHapus

 
GR | Edited by | gubhug reyot