Membuat buku tamu melayang
langsung saja yaaa....
caranya :
1. Login Ke blog dulu
2. MAsuk Ke Rancangan
3. Tambahgan ADD Gadget
4. Pilih HTML
5. Copy Paste Code Dibawah ini :
ini code nya :
<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:120px;
width:60px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:3px solid #00FF00;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvcAJchr7vcyhQAvm027naJ4m15H1LF-YE9cE2eF8KkdMTL6FGiPyVAsrtUBNiYAvRxzNclL-cZn2Lb-0HPRVJh-_Y7FA583znXs3IhFazKoyVb2MTgDt0xCszUuObz-7NAb_8Q-qjpQg/s1600/Wido2.gif) #000000 repeat-y center;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
-moz-box-shadow: 0px 2px 5px 0px #00FF00;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style:url(http://i53.tinypic.com/6gx34z.jpg) no-repeat center;">
<br />
------ Code Buku Tamu Anda --------
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="http://i53.tinypic.com/vvtyc.png" alt="Close" title="Click here to Close Cbox" /></a></div>
</div></div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>
<div style='display:scroll; position:fixed; top:60px; right:0px;'><a href="javascript:void(0);"onclick="showHideAT()"/><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9wEO3TGDtWojN0Gx_cr9BfyU3Z9PPRM9brLKKjgW_kiI25lXV7mXBi6l4dt0PKRDjt6SzQiKVXYBUNctIK4w_E2qlZwRmTOBuQwPvr27aQ2L-tEG4EGWxiZYwaIxldJQn1XIz-aUUk_A/s1600/bkuwd.gif"/></a>
</div></div></div>
CATATAN :
1. Ganti Tulisan Yang berwarna MERAH dengan Buku tamu Anda
2. Ganti Tulisan Yang Berwarna BIRU dengan Image Jika Mau di Ganti
Semoga bermanfaat dan berguna buat anda, terima kasih.
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:120px;
width:60px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:3px solid #00FF00;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvcAJchr7vcyhQAvm027naJ4m15H1LF-YE9cE2eF8KkdMTL6FGiPyVAsrtUBNiYAvRxzNclL-cZn2Lb-0HPRVJh-_Y7FA583znXs3IhFazKoyVb2MTgDt0xCszUuObz-7NAb_8Q-qjpQg/s1600/Wido2.gif) #000000 repeat-y center;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
-moz-box-shadow: 0px 2px 5px 0px #00FF00;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style:url(http://i53.tinypic.com/6gx34z.jpg) no-repeat center;">
<br />
------ Code Buku Tamu Anda --------
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="http://i53.tinypic.com/vvtyc.png" alt="Close" title="Click here to Close Cbox" /></a></div>
</div></div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>
<div style='display:scroll; position:fixed; top:60px; right:0px;'><a href="javascript:void(0);"onclick="showHideAT()"/><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9wEO3TGDtWojN0Gx_cr9BfyU3Z9PPRM9brLKKjgW_kiI25lXV7mXBi6l4dt0PKRDjt6SzQiKVXYBUNctIK4w_E2qlZwRmTOBuQwPvr27aQ2L-tEG4EGWxiZYwaIxldJQn1XIz-aUUk_A/s1600/bkuwd.gif"/></a>
</div></div></div>
CATATAN :
1. Ganti Tulisan Yang berwarna MERAH dengan Buku tamu Anda
2. Ganti Tulisan Yang Berwarna BIRU dengan Image Jika Mau di Ganti
Semoga bermanfaat dan berguna buat anda, terima kasih.
Terima kasih telah berkunjung, berkomentar lah yang sopan sesuai dengan artikel dan dilarang keras :
Bck1. spam, rasis
2. promosi
3. berkomentar blogwalking
4. link aktif