Code Ẩn Hiện Chatbox Cho Blogspot

Code Ẩn Hiện Chatbox Cho Blogspot 

Ta chỉ việc tiến hành thêm 1 tiện ích,tiện ích này để ở vị trí nào cũng được tốt nhất là để ở đáy blog và dán code sau vào

Trường hợp tự động xuất hiện khi rê chuột

<style type="text/css">

#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}.fbplbadge {background-color:Transprant;border:0px solid #fff;display: block;height: 160px;top: 20%;margin-top: -75px;position: absolute;left: -70px;width: 71px;background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifZp833CH562CRJ3u-mUvYFGCCHA2rm79Hfb6WW7Vk0GefW5DqeSFPFVP02xCgGxsDQmEqPC0laFBS4-gmWSW7CVBCm6tBdPvcyMpH2OfoZ7ikaila8BIbbXY3dNHNHs_vuMA1viB0Cos/s1600/chatbox.png);background-repeat: no-repeat;overflow: hidden;-webkit-border-top-left-radius: 8px;-webkit-border-bottom-left-radius: 8px;-moz-border-radius-topleft: 8px;-moz-border-radius-bottomleft: 8px;border-top-left-radius: 8px;border-bottom-left-radius: 8px;}.mdfbplikebox span{bottom: 12px;font: 10px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}.mdfbplikebox span a{color: #808080;text-decoration:none;}.mdfbplikebox span a:hover{text-decoration:underline;}

</style>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<script type="text/javascript">

(function(md){

md(document).ready(function(){

var $dur = "medium"; // Duration of Animation

md("#fbplikebox").css({right: -250, "top" : 100 })

md("#fbplikebox").hover(function () {

md(this).stop().animate({

right: 0

}, $dur);

}, function () {

md(this).stop().animate({

right: -270

}, $dur);

});

md("#fbplikebox").show();

});

})(jQuery);

/*]]>*/

</script>

<div class="mdfbplikebox">

<div id="fbplikebox" style="display:none;">

<div class="fbplbadge"></div>

 <!-- Thay chatbox của bạn vào đây start -->

<div id="cboxdiv" style="text-align: center; line-height: 0">

<div><iframe frameborder="0" width="270" height="305" src="http://www7.cbox.ws/box/?boxid=777495&amp;boxtag=spnyd1&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain7-777495" style="border:#ababab 1px solid;" id="cboxmain7-777495"></iframe></div>

<div><iframe frameborder="0" width="270" height="75" src="http://www7.cbox.ws/box/?boxid=777495&amp;boxtag=spnyd1&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform7-777495" style="border:#ababab 1px solid;border-top:0px" id="cboxform7-777495"></iframe></div>

</div>

<!-- Thay chatbox của bạn vào đây End -->

</div>

</div>

Trường hợp click mới xuất hiện

<style type="text/css">

#gb{

position:fixed;

top:60px;

z-index:+1000;

}

* html #gb{position:relative;}

.gbtab{

height:130px;

width:70px;

float:left;

cursor:pointer;

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifZp833CH562CRJ3u-mUvYFGCCHA2rm79Hfb6WW7Vk0GefW5DqeSFPFVP02xCgGxsDQmEqPC0laFBS4-gmWSW7CVBCm6tBdPvcyMpH2OfoZ7ikaila8BIbbXY3dNHNHs_vuMA1viB0Cos/s1600/chatbox.png) no-repeat;

}

.gbcontent{

float:left;

background:none;

padding:3px;

}

</style>

<script type="text/javascript">

function showHideGB(){

var gb = document.getElementById("gb");

var w = gb.offsetWidth;

gb.opened ? moveGB(0, 75-w) : moveGB(71-w, 0);

gb.opened = !gb.opened;

}

function moveGB(x0, xf){

var gb = document.getElementById("gb");

var dx = Math.abs(x0-xf) > 10 ? 5 : 1;

var dir = xf>x0 ? 1 : -1;

var x = x0 + dx * dir;

gb.style.right = x.toString() + "px";

if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}

}

</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()">

</div>

<div class="gbcontent">

<!-- Thay Chatbox của bạn vào đây Start -->

<iframe src="http://chatwing.com/chatbox/e6b653f5-b8c2-413b-af66-ffde1025d72b" width="200" height="350" frameborder="0" scrolling="0">Please contact us at info@chatwing.com if you cant embed the chatbox</iframe>

<!-- Thay Chatbox của bạn vào đây end --></div>

</div>

<script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.ri</script>

Phần code bôi màu đỏ là phần chatbox của bạn sau khi đã tạo được và đem thay vào đó.

Thế là xong, chúc các bạn thành công.

• Tweet
• Share
• Share
• Share
• Share