Mau membuat kotak follow tersembunyi seperti di cybertex komputer? Follow box tersembunyi akan tampak lebih rapi untuk blog anda.
MEMBUAT FOLLOW BOX TERSEMBUNYI
1. Buka Google Friend Connect
2. Buat Gadget Anggota / Follow
3. Setelah Selesai, Catat Kode yang di dapat di Notepad
4. Login ke Blogger
5. Pilih Rancangan > Edit laman
6. Tambah Gadget > HTML / Javascript
7. Letakkan Kode di Bawah ini
<style type="text/css">
#fl{
position:fixed;
right:250px;
z-index:+1000;
}
* html #fl{position:relative;}
.flcontent{
float:left;
border:2px solid #676767;
background:url(http://irenkdesign.files.wordpress.com/2008/09/burst_7.gif)#000000 repeat-x bottom center scroll;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideFL(){
var fl = document.getElementById("fl");
var w = fl.offsetWidth;
fl.opened ? moveFL(0, -100-w) : moveFL(20-w, 0);
fl.opened = !fl.opened;
}
function moveFL(x0, xf){
var fl = document.getElementById("fl");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
fl.style.bottom = x.toString() + "px";
if(x0!=xf){setTimeout("moveFL("+x+", "+xf+")", 10);}
}
</script>
<div id="fl">
<div class="fltab" onclick="showHideFL()"> </div>
<div class="flcontent">
Letakkan Kode Widget Follow yang di catat di notepad tadi.
<div style="text-align: center;">
<a href="javascript:showHideFL()">
[Close Box Follow]
</a></div>
Mau Box Follow Seperti ini ? <a href="
http://xenon-vista.blogspot.com/2011/05/box-follow-tersembunyi-ala-xenon-vista.html">Click Here!<br />
<a href="http://www.xenon-vista.blogspot.com"><font color="red"/>www.Xenon-Vista.blogspot.com</font></a></a></div>
</div>
<script type="text/javascript">
var fl = document.getElementById("fl");
fl.style.bottom = (-100-fl.offsetWidth).toString() + "px";
</script><a href="javascript:showHideFL()"/><img border="0" src="http://kreyolnetwork.com/images/twitter_follow_me.png" alt="XE" title="Klik untuk membuka Box Follow!" style="display:scroll;position: fixed; top:150px;left:0px;cursor:pointer;style=" opacity:1;filter:alpha(opacity="100)&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50" ;" height="75px" width="100px" /></a>
NB : Ganti Kode yang bewarna Merah dengan kode yang di catat di notepad tadi.
2 komentar:
bang aku mohon izin untuk mengcopy dan menggunakan tutorial ini..
aku sangat terinspirasi oleh blog ini..
Maju terus bang.. selamat berkarya..
Silahkan gan... :D
Terima kasih atas kunjunganya..
Posting Komentar
۩۞۩ Pembaca yang baik selalu meninggalkan komentar yang baik dan sopan. ۩۞۩
Komentar berunsur Junk, Spam, Flaming dan sara tidak akan di tampilkan.