Postingan kali ini bukan tentang Aplikasi Game atau pun konten lainnya,tetapi postingan kali ini yaitu cara membuat like box melayang versi terbaru 2013. Sengaja saya berinama gitu,karna bingung mau bikin nama apaan. Okey dari pada banyak basa basi mending simak berikut caranya :
1. Login ke akun blogger.com sobat
2. Pilih Tata letak.
3. Kemudian Add Gadget
4. Pilih html/javascript
5. Copy kode di bawah ini lalu pastekan ke kotak html/javascript tadi.
6. Save dan lihat hasilnya
<style type='text/css'>
/* Message Box */
#box-message {
position:fixed !important;
position:absolute; /* IE6 */
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#f5f5f5;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #fff;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#f5f5f5;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #fff;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"50px"},
1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>
<!-- HTML Start -->
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/sahabatkudhen&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&appId=112462558775142"
scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</center>
<center><div class='widget-content'>
<a href="http://www.sahabatkudhen.com/2013/04/modding-sunda-droid-only-e63-for-your.html"><div style="background:#999;border:2px solid #fff;border-radius:10px;padding:10px;margin:10px;font-size:16px;"><strong>Sunda Droid For E63<strong></strong></strong></div></a></div></center>
<center><div class='widget-content'>
<a href="http://www.sahabatkudhen.com/2013/03/download-font-samsung-siii-v83-by-ihint.html"><div style="background:#999;border:2px solid #fff;border-radius:10px;padding:10px;margin:10px;font-size:16px;"><strong>Font Samsung SIII v.8.3<strong></strong></strong></div></a></div></center>
<!-- HTML End -->
<a class='close' href='http://sahabatkudhen.com'>×</a></div>
Keterangan :
1. Ganti tulisan yang berwarna merah dengan sesuai kepunyaan sobat,jika kurang paham silahkan berikan komentarnya di bawah... Enjoyyy Guys...
Post a Comment