Sabtu, 30 Maret 2013
- 1. Bersembunyi ketika tidak terkena mouse
- 2. Selalu mengikuti scrool sepanjang halaman blog
- 3. Bisa ditaruh gambar.
Keren bukan?
Kalau begitu langsung saja caranya ya
1. Masuk ke www.blogger.com
2. Ke tata letak
3. HTML / Java Script
4. Pastekan kode beriku
<!-- Widget - http:/davidgunawan123.blogspot.com - Start -->
<style>
ul#navigation {
position: fixed;
margin: 0px;
padding: 0px;
top: 0px;
right: 0px;
list-style: none;
z-index:999999;
width: 993px;
}
ul#navigation li {
width: 103px;
display:inline;
float:left;
border:0;
}
ul#navigation li a {
display: block;
float:left;
margin-top: -2px;
width: 100px;
height: 25px;
background-color:#000000;
background-repeat:no-repeat;
background-position:50% 10px;
border:1px solid #BDDCEF;
-moz-border-radius:0px 0px 10px 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
text-decoration:none;
text-align:center;
padding-top:80px;
opacity: 0.96;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=40);
}
ul#navigation li a:hover{
background-color:#BDBDBD;
}
ul#navigation li a span{
letter-spacing:2px;
font-size:11px;
color:#FFFFFF;
font-family:trebuchet-ms, arial, tahoma, Sans-Serif;
font-weight:bold;
text-shadow: 0 -1px 1px #fff;
}
ul#navigation .rss a{
background-image: url(http://i1123.photobucket.com/albums/l546/wizyuloverz/RSS.png);
}
ul#navigation .facebook a {
background-image: url(http://i1123.photobucket.com/albums/l546/wizyuloverz/Facebook.png);
}
ul#navigation .twitter a {
background-image: url(http://i1123.photobucket.com/albums/l546/wizyuloverz/Twitter.png);
}
ul#navigation .g-mail a{
background-image: url(http://i1123.photobucket.com/albums/l546/wizyuloverz/Google.png);
}
ul#navigation .y-mail a{
background-image: url(http://i1123.photobucket.com/albums/l546/wizyuloverz/Yahoo.png);
}
ul#navigation .youtube a{
background-image: url(http://i1123.photobucket.com/albums/l546/wizyuloverz/YouTube.png);
}
</style>
<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js" type="text/javascript">
</script>
<script type="text/javascript">
$(function() {
var d=300;
$('#navigation a').each(function(){
$(this).stop().animate({
'marginTop':'-80px'
},d+=150);
});
$('#navigation > li').hover(
function () {
$('a',$(this)).stop().animate({
'marginTop':'-2px'
},200);
},
function () {
$('a',$(this)).stop().animate({
'marginTop':'-80px'
},200);
}
);
});
</script>
<ul id="navigation">
<li class="rss"><a target="_blank" href=" http:/davidgunawan123.blogspot.com /atom.xml" rel="http://wizyuloverz.blogspot.com">RSS Feed</a></li>
<li class="facebook"><a target="_blank"href=" http:/davidgunawan123.blogspot.com ">Facebook</a></li>
<li class="twitter"><a target="_blank"href=" http:/davidgunawan123.blogspot.com ">Twitter</a></li>
<li class="g-mail a"><a target="_blank"href=" http:/davidgunawan123.blogspot.com ">Google</a>
<li class="y-mail a"><a target="_blank"href="https://www.Yahoo.com/bookmarks/">Yahoo</a>
<li class="youtube a"><a target="_blank" href=" http:/davidgunawan123.blogspot.com ">YouTube</a></li>
</li>
</li></ul>
<!-- Widget - http://davidgunawan123.blogspot.com - End-->
Keterangan:
Kode kode yang saya beri warna merah, itu berarti diubah menjadi link yang kalian inginkanKode kode yang saya beri warna hijau, itu adalah link gambar facebook, twitter, dll dan bisa kalian ganti sesuai keinginan kalian.
Backlinks
| URL Code |
| Forum Code |
| HTML Code |
WAW
BalasHapus