Membuat Navigasi Melayang

Oke Teman-teman sebelum Saya LUS saya akan memberi sedikit ilmu Saya pada teman-teman sekalian. Oh yah udah pada tau navigasi kan? nah saya mendapat ilmu ini dari teman saya Johanes.

Oke langsung saja ke intinya. apa sih yang melyang? ni saya kasih SSnya

 

Sebelumnya cari kode di bawah ini dan ganti style-style yang ada 

Note:Sobat cari dahulu css #blog-pager,#blog-pager-older-link,#blog-pager-newer-link pada template sobat,bila ada hapus dahulu agar css'a tidak bentrok. 

Style 1

 

Ni Source Codenya:

.home-link {
background: white;
padding: 10px;
-moz-border-radius-topleft: 15px;
-moz-border-radius-topright: 15px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
text-align: center;
position: absolute;
background: rgba(255, 255, 255, 0.8);
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}


#blog-pager-newer-link {
float: right;
padding: 5px;
}
#blog-pager-older-link {
float:left;
padding: 5px;
}
#blog-pager {
text-align: center;
font-family: 'Trebuchet MS', sans-serif;
position: fixed;
font-size:15px;
bottom: 0;
width: 100%;
color:#000000;
left: 0;
margin:0px;
background: -moz-linear-gradient(-90deg, #F3F3F3, #E5E3E4) repeat scroll 0 0 transparent;
background: -webkit-gradient(linear, left top, left bottom, from(#F3F3F3), to(#E5E3E4));
box-shadow: 0 0 5px rgba(0,0,0,0.2);
-moz-box-shadow: 0 0 5px rgba(0,0,0,0.2);
-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.2);
}

#blog-pager a {color:#58A;}

Style 2




.home-link {
background: white;
padding: 10px;
-moz-border-radius-topleft: 15px;
-moz-border-radius-topright: 15px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
text-align: center;
position: absolute;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}


#blog-pager-newer-link {
float: right;
padding: 5px;
}
#blog-pager-older-link {
float:left;
padding: 5px;
}
#blog-pager {
text-align: center;
font-family: 'Trebuchet MS', sans-serif;
position: fixed;
font-size:15px;
bottom: 0;
width: 100%;
color:#000000;
left: 0;
margin:0px;
background: rgba(0, 0, 0, 0.8 );
border-top: 1px dotted #26B7EB;
box-shadow: 0 0 5px rgba(0,0,0,0.2);
-moz-box-shadow: 0 0 5px rgba(0,0,0,0.2);
-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.2);
}

#blog-pager a {color:#58A;}




itulah style2nya dan berkreasilah kalian semua.
Thx Buat Johanes atas ilmunya. :)

Anda sedang membaca artikel tentang Membuat Navigasi Melayang dan anda bisa menemukan artikel Membuat Navigasi Melayang ini dengan url http://bmcyber.blogspot.com/2012/03/membuat-navigasi-melayang.html,anda boleh menyebar luaskannya atau mengcopy paste-nya jika artikel Membuat Navigasi Melayang ini sangat bermanfaat bagi teman-teman anda,namun jangan lupa untuk meletakkan link Membuat Navigasi Melayang sebagai sumbernya.