[Code] Hỗ trợ trực tuyến cực đẹp

Demo:

http://www.hotrofm.com/h18-page

Cho vào Footer End:

Code:

<!-- Begin Support Online -->
<link rel="stylesheet" href="http://haiphongclub.vn/forum/hotro/support.css" type="text/css" media="all" />
<script type="text/javascript" src="http://haiphongclub.vn/forum/hotro/support.js"></script>


<script type="text/javascript">
jQuery(function($) {
var open = false;
$('#footerSlideButton').click(function () {
if(open === false) {
$('#footerSlideContent').animate({ height: '350px' });
$(this).css('backgroundPosition', 'bottom left');
open = true;
} else {
$('#footerSlideContent').animate({ height: '0px' });
$(this).css('backgroundPosition', 'top left');
open = false;
}
});
});
</script>
<script type="text/javascript"> Cufon.now(); </script>




<div id="footerSlideContainer">
<div id="footerSlideButton"></div>
<div id="footerSlideContent">
<div id="footerSlideText">
<span class="titles">Hỗ trợ chung</span>


<ul>
<li>
<center>
<a target="_blank" href="mailto:nampro629@gmail.com" title="Liên lạc qua Email"><img src="http://haiphongclub.vn/forum/hotro/email.jpg" border="0"> Liên lạc qua Email</a></center>
</li>


<li>
<span class="left">
<font lolor=red><a rel="nofollow" href="ymsgr:sendIM?phiboy_tanuyen"><img src="http://opi.yahoo.com/online?u=phiboy_tanuyen&m=g&t=5" alt="Hỗ trợ chung " /> Nguyễn Phi Nam</a></span></font>
<span class="right">Admin</span>
</li>

<li>
<span class="left">
<a rel="nofollow" href="ymsgr:sendIM?dangthanhhien105"><img src="http://opi.yahoo.com/online?u=dangthanhhien105&m=g&t=5" alt="TanUyen.Biz" /> Đặng Thanh Hiền</a></span>
<span class="right">Admin</span>
</li>

<li>
<span class="left">
<a rel="nofollow" href="ymsgr:sendIM?yumi_lc"><img src="http://opi.yahoo.com/online?u=yumi_lc&m=g&t=5" alt="TanUyen.Biz" /> Lê Anh Phương</a></span>
<span class="right">Admin</span>
</li>



</ul>


<div class="line"></div>
<span class="titles">Hỗ trợ Khu vực</span>
<ul>
<li>
<span class="left">
<a rel="nofollow" href="ymsgr:sendIM?nickyahoo"><img src="http://opi.yahoo.com/online?u=nickyahoo&m=g&t=5" alt="Haiphongclub.Vn" /> Hỗ trợ 1</a></span>
<span class="right">Hỗ trợ 1</span>
</li>


<li>
<span class="left">
<a rel="nofollow" href="ymsgr:sendIM?nickyahoo"><img src="http://opi.yahoo.com/online?u=nickyahoo&m=g&t=5" alt="Haiphongclub.Vn" /> Hỗ trợ 2</a></span>
<span class="right">Hỗ trợ 2</span>
</li>
<li>
<span class="left">
<a rel="nofollow" href="ymsgr:sendIM?nickyahoo"><img src="http://opi.yahoo.com/online?u=nickyahoo&m=g&t=5" alt="Haiphongclub.Vn" /> Hỗ trợ 3</a></span>
<span class="right">Hỗ trợ 3</span>
</li>
<li>
<span class="left">
<a rel="nofollow" href="ymsgr:sendIM?nickyahoo"><img src="http://opi.yahoo.com/online?u=nickyahoo&m=g&t=5" alt="Haiphongclub.Vn" /> Hỗ trợ 4</a></span>
<span class="right">Hỡ trợ 4</span>
</li>

<li>
<span class="left">
<a rel="nofollow" href="ymsgr:sendIM?nickyahoo"><img src="http://opi.yahoo.com/online?u=nickyahoo&m=g&t=5" alt="Haiphongclub.Vn" /> Hỗ trợ 5</a></span>
<span class="right">Hỗ trợ 5</span>
</li>
<li>
<span class="left">
<a rel="nofollow" href="ymsgr:sendIM?nickyahoo"><img src="http://opi.yahoo.com/online?u=nickyahoo=g&t=5" alt="Haiphongclub.Vn" /> Hỗ trợ 6</a></span>
<span class="right">Hỗ trợ 6</span>
</li>
<li>
<span class="left">
<a rel="nofollow" href="ymsgr:sendIM?nickyhaoo"><img src="http://opi.yahoo.com/online?u=nickyahoo&m=g&t=5" alt="Haiphongclub.Vn" /> Hỗ trợ 7</a></span>
<span class="right">Hỗ trợ 7</span>
</li>

</ul>


</div>
</div>
</div>
<!-- tanuyen.biz - End Support Online -->