16 November 2011

Slide FLOAT SHOUTBOX!

matamulutyusmardianaBlog 3:54 PM

بِسْـــــــــمِ ﷲِالرَّحْمَنِ الرَّحِيم




Korang ad shoutBox??
korang xske tgk ShoutBox korang semak kat sidebar korang..??
da try yus pny Slide FLOAT ShoutBox???
ala... if korang Klik pic kat blog yus yg ni:

akan kua Laa shout Box yus.... yg ni lak kat bhagian atas blog korang..

Nak Try..?? Jummm... hehe..

1 : : Login >> Dashboard >> Design >> Add a Gadget >> HTML/Javascript

2 : : Copy dan Paste kod  bawh ni pada content korang k..




<style type="text/css">

#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px solid #000000;
background:url() #FF0080 repeat-x bottom center scroll ;
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
padding:10px;
}
</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="background:url() no-repeat;">

KOD SHOUTBOX KORANG!

</div>
</div>

<br />
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="http://3.bp.blogspot.com/_LhHZAifMoFE/TN6myUsdsZI/AAAAAAAAC-Q/VqSys0LrD3o/s1600/close_button.gif" alt="close" title="Close" /></a></div>
<br /><div align="right"><font size="3"><a href="http://wanhazel.blogspot.com/"><div style="color: #FF0000;">
<span ></span></div></a></font></div>
</div></div>


<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>


<style type='text/css'>
a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;F
opacity: 0.5;
-khtml-opacity: 0.5;}

a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>

<div style='display:scroll; position:fixed; top:220px; right:-0px;'>
<a href="javascript:void(0);"onclick="showHideAT()"/><img class="expando" width="120" height="120" src="http://www.iaza.com/work/111116C/iaza15248736243800.png" alt="KLIK JERK" title="Tinggal Jejak anda!"/></a>

</div>

* Highlight Warna Pink tu korang ley tukar ngan kod warna yg korang nak k... kat SINI
* Highlight Oren tu korang kena letak Kod shoutbox korang k..^^V
* Highlight Warna hijaw tuh if korang nak tukar ngn pic korang,korang gantikan kod tu ngn URL pic korang k.. tu yus kasi contoh jerk...
* Highligt Warna Purple lak korang ley tukar pada ayat korang k..yg tu yus kasi contoh jerk^^

3 : : Now korang Ley Save dan View! ^^.. Ciap!

*perhatian! if korang nampak ad Box korang tuh terkeluar kat bahagian atas, kecilkan sedikit saiz shoutbox korang k... contoh yus kasi :

<!-- Begin ShoutMix - http://www.shoutmix.com --><iframe title="yusmardianayacoob" src="http://www.shoutmix.com/?yusmardianayacoob" width="100%" height="350" frameborder="0" scrolling="auto"><a href="http://www.shoutmix.com/?yusmardianayacoob">View shoutbox</a></iframe><br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br /><!-- End ShoutMix -->
Tukarkan saiz height korang cam yus kasi ni k.. if still keluar,kurangkan lagi saiz tuh.. thathz all.. ^^V 

* Tuto ni if korang xmo gne ntuk shoutBox,korang ley gne gak ntuk Like FB Badge,"About Me" korang, or whatever yg korang nak lah! juz korang tukar jer kat Highlight warna Oren tuh k.. ^^

GudLuck!

اَلحَمْدُ لِله

Subhanallah ✿ Alhamdulillah ✿ Lailahaillallah ✿ AllahuAkbar
..✿Time Kasih Kerana Membaca! :) ✿..


No comments:

:: Assalammualaikum..tinggalkan komen Di Sini..◕‿◕ ::