me on twitter

Pingin Navbar Kelihatan Transparan...?

Monday, 16 May 2011 | comments (1)

Transparan..? kayanya asyik nih, apalagi kalau ngeliat pakaian yang transparan. hahahahaha...Tapi kali ini penulis 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 penulis 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

Selamat mencoba, semoga bermanfaat

Membuat Gambar Hidup Di Pojok Halaman Blog

| comments


Anda pingin ada sesuatu gambar hidup yang menghiasi halaman blog anda..?
Gambar ini bisa anda letakkan di salah satu pojok di halaman blog anda.
Anda bisa meletakkannya di kiri atas, kiri bawah, kanan atas ataupun kanan bawah

Bagaimana caranya..?
Silahkan ikuti langkah-langkah berikut ini.

1. Pertama-tama silahkan cari dulu icon yang cocok dengan selera anda di sini [ gifs ]
2. Setelah ketemu gambar yang anda inginkan, silahkan di copy alamat URL nya
3. Masuk ke Dasbor
4. Klik Tata Letak
5. Klik Edit HTML
6. Klik kotak kecil Expand Template Widget
7. Silahkan cari di dalam template anda kode ]]>
8. Persis sebelum kode tersebut, copypastekan script berikut ini

#trik_pojok {
position:fixed;_position:absolute;bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight);
_left:expression(document.documentElement.scrollLeft+
document.documentElement.clientWidth - offsetWidth); }

9. Text yang berwarna merah adalah menunjukkan posisi penempatan dari gambar tersebut
10. Silahkan anda ganti sesuai keinginan anda, (kiri=left, kanan=right, atas=top, bawah=bottom)
11. Berikutnya cari lagi di dalam template anda kode
12. Persis sebelum kode tersebut, copypastekan script berikut ini


13. Silahkan ganti http://pinginbelajar.blogspot.com dengan alamat blog anda
14. Ganti juga http://www.boongan_doang.gif dengan alamat URL gambar pilihan anda, yang telah anda copy (lihat langkah no. 2)
15. Cara mendapatkan URLnya, silahkan anda klik kanan pada gambar yang anda inginkan, kemudian klik Properties, kemudian copy alamat URL yang ditampilkan pada baris Location
16. Klik Pratinjau untuk melihat hasil kerja anda
17. Jika sudah sesuai dengan keinginan anda, klik Simpan Template
18. Selesai

Selamat mencoba, semoga bermanfaat
 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. nU pazthie™ - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger