Cara Membuat Navigasi Menu Share Auto Hidden
10:16 wita
- Minggu, 29 Desember 2013
-
Semenjak Blog kena virus saya jadi malas menulis artikel alias menambah postingan :b; karena :q; semuanya menjadi serba membengkak, sebagai Admin BlogBego Creation saya mohon maaf pada kawan pengunjung yang setia :w; biar tidak kosong sama sekali terpaksa saya copaskan postingan di Blog saya yang lain, yang akan saya bahas sekarang Cara membuat Navigasi Menu Share di sisi kanan yang bisa Auto Hidden
untuk Demonya kawan bisa lihat disini - Masuk Account Blogger dengan ID kawan
- Pada Dasbor pilih Tata Letak - Tambah Gadget
- Pilih tanda [+] pada HTML / JavaScript
- Copas Kode berikut kedalamnya
<style>
ul#navigation1 {
position: fixed;
margin: 0px;
padding: 0px;
top: 100px;
right: 0px;
list-style: none;
z-index:9999;
}
ul#navigation1 li {
width:100px;
border:0px;
display: block;
padding-top:1px;
padding-bottom:1px;
}
ul#navigation1 li a {
display: block;
margin-right: -2px;
width: 100px;
height: 70px;
background-color:transparent;
background-repeat:no-repeat;
background-position:center center;
border:1px solid #FFF;
-moz-border-radius:10px 0px 0px 10px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-top-left-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
-khtml-border-top-left-radius: 10px;
/*-moz-box-shadow: 0px 4px 3px #000;
-webkit-box-shadow: 0px 4px 3px #000;
*/
opacity: 0.8;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);
}
ul#navigation1 .rss a{
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG0SS6GzqUdWisjIG_AG8kKRB5P-CNUfhZh0bbFnJk05OML32VGB__iBVBTzkdeHQjsRzflzoCuCsEoHHNTTU5ODHIwFBHdGjv4tkWOs82NPwasgd7CqIxBQzlzcznPw9dyQ83uISpfps/s400/rss.png);
}
ul#navigation1 .facebook a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYihKcnkbPLQIIIxcADQtaRlvOjrA_T0CN1A76tpP8GlvynesK8R0VUVZvKd42bwchKvOf2AjofwtM7IrF_SdOX92HzTHluIzLQgW5WRYt4QjOM_5fjhv83bB6j8nqYgM23w-iXTRNpdU/s400/facebook.png);
}
ul#navigation1 .twitter a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic-4_RI2On0cwJ9Zzhvt60VwjkwgI-NnGojaBQvdjUvHMcg_3950htsVRQQCbueGBYozcy65qxJ0FCR7LqKV2F0e4MxLOwx3UTtloQwMZooUMrI6vj4g1_hRNN9p9IlMaBybf1d1vQzBs/s400/twitter.png);
}
ul#navigation1 .profile a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUw673lh0qgXLkshK_pcyvPTdbcspVdYajqhdnHY-z-0L8w8oZdGXpzp_7UTHDIRlTu3m6aT1_dc_j0AOUbw7lz3AJNkV3bfyI-RvjVb6wacb3tsqxgVaRDK0qDwiFj3xtmaJjjL3pTMs/s400/photo.png);
}
ul#navigation1 .e-mail a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9h4iFcgELG5Im4gAEilVonNiyM_-_x09nUXt22IakHZbrTbnosShd-Z-CzYTR5Cw3qA7UpI2epf2gB_F3loIqaQu2n6B0ziuzJQISVhTe2OWpGhaoqaInbDJXo27cJu1sW-pWm9eUzoM/s400/mail_edit.png);
}
</style>
<script type="text/javascript" src="https://sites.google.com/site/jquery01/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function() {
$('#navigation1 a').stop().animate({'marginLeft':'85px'},1000);
$('#navigation1 > li').hover(
function () {
$('a',$(this)).stop().animate({'marginLeft':'-2px'},200);
},
function () {
$('a',$(this)).stop().animate({'marginLeft':'85px'},200);
}
);
});
</script>
<ul id="navigation1">
<li class="rss"><a href="http://info-blogbego.blogspot.com/atom.xml" target="_blank"></a></li>
<li class="facebook"><a href="http://www.facebook.com/KASTAONE" target="_blank"></a></li>
<li class="twitter"><a href="http://twitter.com/KASTAONE" target="_blank"></a></li>
<li class="profile"><a href="http://www.blogger.com/profile/14829445231709686413" target="_blank"></a></li>
<li class="e-mail"><a href="https://mail.google.com/mail/u/0/?hl=id&shva=1#inbox" target="_blank"></a>
</li></ul>
- Silahkan ganti teks yang saya beri warna dengan Link kawan
- Teks yang saya beri warna biru [transparent] bisa kawan ganti dengan kode warna
- Simpan Blog kawan
Seandainya Nanigasi Menu ini tidak mau Auto Hidden tambahkan jquery berikut dibawah ]]></b:skin> atau diatas </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
Cara Membuat Navigasi Menu Share Auto Hidden
Kalau pada Artikel Cara Membuat Navigasi Menu Share Auto Hidden
kurang jelas atau ada Artikel, Link yang tak jalan / rusak bisa disampaikan lewat Komentar
mudah-mudahan saya bisa segera memperbaiki
---ooOOOoo---
{[["☆","★"]]}
Rate this posting: Kalau pada Artikel Cara Membuat Navigasi Menu Share Auto Hidden
kurang jelas atau ada Artikel, Link yang tak jalan / rusak bisa disampaikan lewat Komentar
mudah-mudahan saya bisa segera memperbaiki
---ooOOOoo---
Keren Blog nya kawan . tapi itu tulisan yang bewarna biru diatas ga ada
BalasHapusAda kok teksnya berwarna biru transparent :x;
BalasHapusMakasih mas tutorialnya, boleh ijin copas share klo boleh
BalasHapussilahkan kawan, kalau untuk share jangan lupa sebutkan sumbernya :q;
BalasHapusThankyou mas bro... ana mohon copas scip nya dech..
BalasHapusmohon saran dan kritiknya jg di http://www.anasbocah87.blogspot.com/
1 lagi brow kalau boleh mintasatu ilmunya dong cara ganti url link blognya dong.. yg http://www.anasbocah87.blogspot.com/ pengen di ganti jd www.akupunyablog.blogspot.com gmn thu??
mungkin maksud kawan mau mengganti url blog dari anasbocah87.blogspot.com menjadi akupunyablog.blogspot.com
Hapusbiasanya mengganti dengan domain berbayar, kalau tetap di blogspot coba pada Setelan / Pengaturan pilih Dasar temukan Alamat Blog - Edit
anasbocah87 diganti menjadi akupunyablog
mudah-mudahan berhasil :b;
Nice post gan , semoga sukses selalu, jangan lupa kunjung balik yah gan
BalasHapusDomino QQ
Domino 99
Capsa Susun
Adu Q
Sakong Online
Bandar Poker
Bandar Q
Poker Online
agen poker
situs poker
dominoqq
domino99
bandarq
kiu kiu
qiu qiu
semoga selalu sukses dimana pun berada dan konten semakin meningkat trafik, ijin untuk membuat koment ya admin.
BalasHapuspastipoker