Cara Membuat FB Like Box Melayang Dengan Tombol Close

 
Cara Membuat Fans Page Like Facebook Melayang
Cara Membuat FB Like Box Melayang Dengan Tombol Close
Cara Membuat  Gadget Fan Halaman Facebook Melayang | Widget Fan Box Facebook Melayang
Widget satu ini sudah gak asing namun bila ada yang berminat silahkan digunakan dan dipasang pada gadget / HTML

Silahkan di copas kode dibawah ini
<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:#fff;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-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:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-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/vulkanisironline&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;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://dangstars.blogspot.com/2012/03/tahapan-dan-bagian-proses-vulkanisir.html"><div style="background:#ffd000;border:2px solid #d19700;border-radius:10px;padding:10px;margin:10px;font-size:16px;"><strong>Langkah Kerja Vulkanisir Ban<strong></strong></strong></div></a></div></center>

<center><div class='widget-content'>
<a href="http://dangstars.blogspot.com/2012/01/vulkanisir.html"><div style="background:#ffd000;border:2px solid #d19700;border-radius:10px;padding:10px;margin:10px;font-size:16px;"><strong>Informasi Vulkanisir Ban<strong></strong></strong></div></a></div></center>

<!-- HTML End -->
<a class='close' href='http://dangstars.blogspot.com'>&times;</a></div>
Perhatikan yang warna merah ganti dengan punya sobat ok !
Untuk Script Warna Biru  kalo sudah terpasang jangan digunakan agar tidak error..

1 Comments:

mantab.. terimakasih banyak buat script tutorialnya...

Reply