Khung chứa chat box

Khung này giúp ẩn hiển chat box với hiệu ứng đẹp và ít ảnh hưởng tới tốc độ tải của blog.


DEMO






Cách thực hiện rất đơn giản, chỉ cần chèn đoạn code dưới vào trước (trên) thẻ </body>


<style type='text/css'>
.gb_fixed{position:fixed;top:30px;right:0px;z-index:+10;}
* html .gb_fixed {position:relative;}
#hidden_gb2 {
display:none;
border:4px solid #bf3989; 
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
background:#fff; 
padding:0 3px 3px 3px; 
}
</style>
<div class='gb_fixed'>
<table cellpadding='0' cellspacing='0' id='hidden_gb2'>
<tr><td><div><a href='javascript:void(0)' onclick='gb_showHideGB()'><b><center>[ Đóng Chat Box ]</center></b></a></div>

Code Shoutbox/Cbox

</td></tr></table></div>
<script type='text/javascript'>
//<![CDATA[
var gb_obj = document.getElementById("hidden_gb2");
var gb_finish = false;

function gb_setInitBehaviour(){
gb_obj.isHidden = true;
gb_setOpacity(gb_obj, "0.01");
}
function gb_setOpacity(obj, opacity){
opacity = opacity.substr(0, 4);
obj.style.opacity = opacity;
obj.style.filter = "alpha(opacity="+(Math.floor(parseFloat(opacity)*100)).toString()+")";
//writex(opacity);
}
function gb_showGB(){
gb_obj.style.display = "block";
gb_changeOpacityTo(1, "");
gb_obj.isHidden = false;
}
function gb_hideGB(){
gb_changeOpacityTo(0.01, "gb_obj.style.display = \"none\"");
gb_obj.isHidden = true;
}
function gb_changeOpacityTo(fin, funcStr){
var init = parseFloat(gb_obj.style.opacity.substr(0, 4));
var d = init <= 0.2 ? 0.04 : init <= 0.6 ? 0.08 : 0.20;
var m = fin>init ? 1 : -1;
var opacity = init + d * m;
if((fin-opacity)*(fin-init)<0){opacity = fin;}
gb_setOpacity(gb_obj, opacity.toString());
if(opacity != fin){setTimeout("gb_changeOpacityTo("+fin.toString()+", '"+funcStr+"')", 50);}
else{eval(funcStr);}
}
function gb_showHideGB(){
if(gb_obj.isHidden){gb_showGB();}
else{gb_hideGB();}
}
function writex(str){
document.getElementById("wx").innerHTML += str + " ";
}
gb_setInitBehaviour();
//]]>
</script>

<div class='gb_fixed' style='z-index:+5'>
<a href='javascript:void(0)' onclick='gb_showHideGB()'>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnwn3cS8pmcVXP6OfhynWU5LKxKMw8iROOg-n6nhleG-vWuumRiR_AG9QTY6Fn38D_vFI_V8EXQ52THGzS7NBUnvEj-2IhcEkMykJIBO7xwL7B7dQ_J2rY51E9tN-DmTkIWA-u8dynNGc/s1600/cbutton.png'/>
</a></div>

Bạn cần thay đoạn code màu xanh thành code chat box của bạn, nếu chưa có thì đăng kí tại www.cbox.ws hoặc www.shoutmix.com

Comments