网站左右折叠框：
<!DOCTYPE html>
<html>
<style>
#Kefclose,#Kefopen{position:absolute;left:-32px;top: %;display:block;width:32px;height: 100px;border-radius:15px 15px}
#Kefclose{background:url(../images/cclose.png) no-repeat center center #eee;background-size:20px;}
#Kefopen{background:url(../images/oopen.png) no-repeat center center #eee;background-size:20px;}
#Kefopen{display:none;}
</style>
<body>
<div id="online_qq_layer">
<a href="javascript:;" id="Kefclose"></a>
<a href="javascript:;" id="Kefopen"></a>
</div>
<script>
$(dunction(){
$("#Kefclose").click(function () {
$("#online_qq_layer").animate({
marginRight:"-144px" }, "slow",function(){
$("#Kefclose").hide();
$("#Kefopen").show();
}); });
$("#Kefopen").click(function () {
$("#online_qq_layer").animate({
marginRight:"-4px", display:"block" }, "slow", function () {
$("#Kefopen").hide();
$("#Kefclose").show();
}); });
});
</script>
</body>
</html>
效果：