Kali ini saya akan membahas Cara Membuat Kotak Like Facebook Melayang Dengan Tombol Close, dengan bantuan jQuery akan memberi efek slide yang bertulisan Please Follow Us, Langsung saja yuk dicobain...
1. Login ke blog kamu.
2. Pilih Rancangan > Edit HTML > Cari kode </head> > letakan kode di bawah ini tepat di atas kode </head><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
3. Simpan dan kembali ke menu awal Rancangan > Add Gadget > HTML/JavaScript > Copy kode di bawah ini.<script src='http://latesthack.googlecode.com/svn/trunk/html/latesthack.js'></script>
<div id="latesthackpopupslider" style="position:absolute;
width:300px;
height:300px;
background:#ffffff;
top:50px;
border:5px solid #ccc;
z-index:999;
display:none;
padding:10px;
left:-300px;"><a href="#" id="latesthackclose" style="color:#ddd!important;" onclick="return false;"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5zSNmNVSXOhTUX27Vn10ZrhHkH2FT7Vm1ioRkx0mo_9OWQHmfILDpn2S5Ri4pyI2ar7Jd1K3wRaNRfrmfSkziCO7kARupICHXus-WGRWeXMm42FQ-O6tMoSWM_Jgw6nsbQOliysNC5FQ/s1600/CROSSBYLATESTHACK.png" align="right" /><span style=color:#333;font-weight:bold;font-size:13px;">Follow kami di Facebook dengan menekan tombol like yang ada di bawah ini</span> </a>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FCarasuka&width=300&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>
</div>
Ganti kode yang berwarna merah dengan username facebook anda (contoh : facebook.com/carasuka)
Dan ganti kode yang berwarna biru dengan kata-kata lainnya.
Sebenarnya saya agak bedakan dengan punya saya, jika anda bisa utak atik, pasti bisa.
Related Posts
Kumpulan JavascriptSobat kiat-cara.comUntuk mempercantik blog kita, berikut adalah kumpulam javascript yang bisa diguna[...]
Cara Membuat 3 Tab Menu Dengan JQuery Dan CSS, 3 Tab Menu ini sama dengan Menu Tab View yang pernah saya bahas pada posting Cara Mudah Membuat Menu Tab View kali ini 3 Tab Menu ini lebih mudah cara membuat nya dengan menggunakan JQuery Dan CSS, bahkan lebih keren, fungsi 3 Tab Menu ini bisa kamu gunakan untuk menghemat ruang di sidebar blog kamu, jadi krsimpulan nya saat 3 Tab Menu ini di klik maka akan langsung muncul widget yang kamu pasang pada Tab Menu ini contoh nya Recent Post, Random Post, Popular Post kamu bisa menyatukan nya dalam Tab Menu.Bagi kamu yang tertarik membuat 3 Tab Menu ini silahkan perhatikan baik-baik contoh yang akan saya berikan.
Berikut
Cara Membuat 3 Tab Menu Dengan JQuery Dan CSS :
Pilih Add Gadget > HTML JavaScript dan Copy kode di bawah ini.
<style>
#tabbed_box_1 {margin: 0px auto 0px auto;width:300px;}
.tabbed_box h4 {font-family:Arial, Helvetica, sans-serif;font-size:23px;color:#ffffff;letter-spacing:-1px;margin-bottom:10px;}
.tabbed_box h4 small {color:#e3e9ec;font-weight:normal;font-size:9px;font-family:Verdana, Arial, Helvetica, sans-serif;text-transform:uppercase;position:relative;top:-4px;left:6px;letter-spacing:0px;}
.tabbed_area {border:1px solid #494e52;background-color:#636d76;padding:8px;}
ul.tabs {margin:0px; padding:0px;margin-top:5px;margin-bottom:6px;}
ul.tabs li {list-style:none;display:inline;}
ul.tabs li a {background-color:#464c54;color:#ffebb5;padding:8px 14px 8px 14px;text-decoration:none;font-size:9px;font-family:Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;text-transform:uppercase;border:1px solid #464c54;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisL3Gj8QgEtoHLOgUNayW635Z8yZLOSOeI0-r893jIFJPaT3k8gTLjelQ_H5bQeamAjnVBcKxj9d0LXgaWPjvcc_ngNFXJKvBctqWYFRI-9EG0F2u7HpbB_vp7Zi7mJjk4VYk9yaCGUXM/s1600/tab_off.jpg"/>Cara Membuat 3 Tab Menu Dengan JQuery Dan CSS Cara Membuat 3 Tab Menu Dengan JQuery Dan CSS - Kali ini saya akan menjelaskan mengenai Tips Blog ya[...]
Posting Komentar
Click to see the code!
To insert emoticon you must added at least one space before the code.