/*页面右侧栏动作*/
$(".side ul li").hover(function(){
var selected = $(this).attr("id");
if(selected != null && selected == "tel"){
$(this).find(".sidebox").stop().animate({"width":"174px"},200).css({"opacity":"1","filter":"Alpha(opacity=100)","background":"#ae1c1c"})
}else {
$(this).find(".sidebox").stop().animate({"width":"124px"},200).css({"opacity":"1","filter":"Alpha(opacity=100)","background":"#ae1c1c"})
}
},function(){
$(this).find(".sidebox").stop().animate({"width":"54px"},200).css({"opacity":"0.8","filter":"Alpha(opacity=80)","background":"#000"})
});
function goPageTop(){
$(‘html,body‘).animate({‘scrollTop‘:0},600); //滚回顶部的时间，越小滚的速度越快~
}
<!-- 右侧滑动 --> <div class="side"> <ul> <li> <a href="" target="_blank"> <div class="sidebox"><img src="/img/icon/side/qq.png">在线咨询</div> </a> </li> <li id="tel"> <a href="#hotline"> <div class="sidebox" ><img src="/img/icon/side/tel.png"><strong>400 720 7200</strong></div> </a> </li> <li> <a href=""> <div class="sidebox"><img src="/img/icon/side/help_center.png">帮助中心</div> </a> </li> <li> <a href="javascript:goPageTop();" class="sidetop"> <div class="sidebox" ><img src="/img/icon/side/gotop.png">返回顶部</div> </a> </li> </ul> </div>
原文：http://www.cnblogs.com/freespider/p/4280168.html