Pada artikel kali ini saya akan memberikan cara untuk menyembunyikan Facebook Fans Page dengan animasi jQuery. Bagaimana? Anda tertarik untuk mencobanya? Namun sebelumnya anda harus mempunyai Facebook Fans Page terlebih dahulu. Jika Anda belum membuatnya, silakan baca artikel saya sebelumnya yang berjudul "Cara Membuat Facebook Fans Page dan Memasang Like Box di Blogspot".
Nah, sekarang kita langsung praktekkan saja. Ikuti langkah berikut.
- Seperti biasanya, pertama-tama, Masuk Blogger > Rancangan > Edit HTML.
- Kedua, cari kode </head> (gunakan Ctrl + F Untuk mempermudah pencarian).
- Ketiga,Copy Dan paste Kode Di bawah Ini Tepat sebelum kode </head>, Jika Anda sudah pernah memasang jQuery ini, maka langsung ke langkah 5 saja. <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
- Jangan lupa klik Simpan Template.
- Sekarang ke Rancangan > Elemen Lama > Tambah gadget > Html/JavaScript.
- Copy script di bawah ini lalu pastekan ke HTML/JavaScript yang Anda buka tadi.
- Dan terakhir , klik Simpan.
<script type="text/javascript">
//<!--
$(document).ready(function() {$(".sektimlikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.sektimlikebox{background: url("http://www.talesoftalisman.com/2012/images/fb110.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 100px;padding: 0 5px 0 30px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:200px;}
.sektimlikebox div{border:none;position:relative;display:block;}
.sektimlikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.sektimlikebox span a{color: #808080;text-decoration:none;}
.sektimlikebox span a:hover{text-decoration:underline;}
</style><div class="sektimlikebox" style=""><div>
<iframe src="//www.facebook.com/plugins/likebox.php?href=URL-Facebook anda disini&width=245&height=330&colorscheme=dark&show_faces=true&border_color=FFFFFF&stream=false&header=false" scrolling="no" frameborder="0" style="background:#FFF; border:none; overflow:hidden; width:245px; height:330px;" allowtransparency="true" ></iframe><span><a href="http://kdablog-tutor.blogspot.com/2012/09/cara-membuat-facebook-fans-page.html" target="_blank">Mau widget ini?</a></span></div></div>
//<!--
$(document).ready(function() {$(".sektimlikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.sektimlikebox{background: url("http://www.talesoftalisman.com/2012/images/fb110.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 100px;padding: 0 5px 0 30px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:200px;}
.sektimlikebox div{border:none;position:relative;display:block;}
.sektimlikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.sektimlikebox span a{color: #808080;text-decoration:none;}
.sektimlikebox span a:hover{text-decoration:underline;}
</style><div class="sektimlikebox" style=""><div>
<iframe src="//www.facebook.com/plugins/likebox.php?href=URL-Facebook anda disini&width=245&height=330&colorscheme=dark&show_faces=true&border_color=FFFFFF&stream=false&header=false" scrolling="no" frameborder="0" style="background:#FFF; border:none; overflow:hidden; width:245px; height:330px;" allowtransparency="true" ></iframe><span><a href="http://kdablog-tutor.blogspot.com/2012/09/cara-membuat-facebook-fans-page.html" target="_blank">Mau widget ini?</a></span></div></div>
0 komentar:
Posting Komentar
Tolong memberi komentar yang tidak melanggar norma-norma. Kami berhak menghapus komentar yang kasar, mengejek, bersifat menyerang, dan tidak berhubungan dengan artikel di atas. Oleh sebab itu, kiranya dapat menggunakan bahasa yang jelas!
Pedoman wajib untuk memasukkan komentar:
1. Tidak boleh memakai lebih dari satu kolom komentar.
2. Pertanyaan/masukan harus berhubungan dengan uraian diatas.
3. Sebaiknya satu atau dua pertanyaan dalam satu kolom komentar.
4. Hanya menggunakan bahasa Indonesia yang umum dan dimengerti semua orang.
Bila Anda punya nama atau blog gunakan komentar sebagai "Name/ URL".
Sebelumnya Admin minta maaf jika komentar anda blm sempat dibls. ^^