Pingin Navbar Kelihatan Transparan...?

      

     Transparan..? sepertinya asyik nih, apalagi kalau ngeliat pakaian yang transparan. hehehe... (Juzt Kidding) Tapi kali ini saya akan membahas tentang cara membuat Navbar yang ada di baris paling atas halaman blog kita agar kelihatan transparan atau menghilang.

     Navbar ini nantinya akan kelihatan transparan, dan akan kelihatan nyata kembali apabila pointer mouse berada di navbar tersebut. Dan sekalian saya akan menyertai juga cara membuat navbar tersebut menghilang, dan akan kelihatan nyata kembali apabila pointer mouse berada di navbar tersebut.

Untuk mengetahuinya, silahkan ikuti langkah-langkah berikut ini :

1. Masuk ke Dasbor.

2. Klik Tata Letak.

3. Klik Edit HTML.

4. Silahkan cari kode berikut ini di dalam template anda.

#navbar-iframe { bla bla bla bla bla }

5. Setelah ketemu, ganti semua kode tersebut dengan salah satu kode di bawah ini

kode untuk kelihatan transparan :

#navbar-iframe { opacity:0.2; filter:alpha(Opacity=0); }
#navbar-iframe:hover { opacity:0.5; filter:alpha(Opacity=100, FinishedOpacity=50); }

kode untuk tidak kelihatan sama sekali (menghilang) :

#navbar-iframe { opacity:0.0;filter:alpha(Opacity=0); }
#navbar-iframe:hover { opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100); }

6. Klik Pratinjau untuk melihat hasil kerja anda.

7. Klik Simpan Template jika seandainya sudah sesuai dengan keinginan anda.

8. Selesai.

     Semoga postingku tentang blogging tutorial ini sangat sangat bermanfaat bagi blog anda dan mendatangkan banyak pengunjung.., semoga bermanfaat ya !! kutunggu komentar dari kalian !!

Artikel Terkait

9 komentar:

obat tradisional asam urat mengatakan...

wah,.maksi banya atas infonya,..!!

Deo Pradipta mengatakan...

sama_sama yakkk :3

Moh imran mengatakan...

wah yang ini harus aku coba dulu, siapa tahu bisa sukses, salam makrifatbusiness.net

Moh imran mengatakan...

waduh tidak ketemu posisi #navbar , dimana kira kira mas letaknya?

Deo Pradipta mengatakan...

coba ' navbar ' aja sob...

SYARIF_SUWARA mengatakan...

Bagian navbarnya gak ketemu gan...

Deo Pradipta mengatakan...

#navbar-iframe ada sob.. ane liat dari kode sourcenya agan

view-source:http://syarifpengembaracinta.blogspot.com/

syadrina mengatakan...

thanks ya sob, berguna bgt nih semuanya :)
tapi ko yang salju itu menyamping ya? ._.

Deo Pradipta mengatakan...

kalo menyamping gitu diatas kode /head , semoga beruntung ^^

Poskan Komentar

Askorus Distro Askorus Distro
Copyright 2010 - 2012 ^ Akatsuki Blog™ - Compatible with Chrome 1024 x 768 -