相關：《即插即用 返回頂部 javascript》

之前發布的即插即用返回頂部jQuery，今天再次分享一個案例，是一個集返回頂部、意見反饋、二維碼彈出的代碼。今天分享的案例也更符合zblog模板。

<div class="bottom_tools">
  <div class="qr_tool">二維碼</div>
  <a id="feedback" href="#" title="意見反饋">意見反饋</a> <a id="scrollUp" href="javascript:;" title="飛回頂部"></a>
  <div class="qr_img"><img src="images/ewm.jpg" width="150" height="150" /></div>
</div>

$(function(){
 var $bottomTools = $('.bottom_tools');
 var $qrTools = $('.qr_tool');
 var qrImg = $('.qr_img');
 
 $(window).scroll(function () {
  var scrollHeight = $(document).height();
  var scrollTop = $(window).scrollTop();
  var $windowHeight = $(window).innerHeight();
  scrollTop > 50 ? $("#scrollUp").fadeIn(200).css("display","block") : $("#scrollUp").fadeOut(200);   
  $bottomTools.css("bottom", scrollHeight - scrollTop > $windowHeight ? 40 : $windowHeight + scrollTop + 40 - scrollHeight);
 });
 
 $('#scrollUp').click(function (e) {
  e.preventDefault();
  $('html,body').animate({ scrollTop:0});
 });
 $qrTools.hover(function () {
  qrImg.fadeIn();
 }, function(){
   qrImg.fadeOut();
 });
 
});

.bottom_tools{position:fixed;z-index:1070;right:40px;bottom:40px;}
.bottom_tools>*{font:0/0 a;display:block;margin-top:5px;color:transparent;border:0;background-color:transparent;text-shadow:none}
.qr_img{position:absolute;top:-189px;left:-183px;display:none; width:173px; height:234px; background:url(images/qr_img.png) no-repeat;}
.qr_img img{ width:150px; margin:0 auto; display:block; margin-top:30px;}
#scrollUp{width:45px;height:45px;background-image:url(images/backgrounds.32.png);background-position:-54px -53px;display:none;}
#scrollUp:hover{background-image:url(images/backgrounds.32.png);background-position:-100px -53px}
#feedback{width:45px;height:45px;background-image:url(images/backgrounds.32.png);background-position:-102px 0}
#feedback:hover{background-image:url(images/backgrounds.32.png);background-position:-146px -46px}
.qr_tool{width:45px;height:45px;background-image:url(images/backgrounds.32.png);background-position:-148px 0;cursor:pointer;}
.qr_tool:hover {width: 45px;height: 45px;background-image: url(images/backgrounds.32.png);background-position: -192px -46px;}

返回頂部中需要的背景圖片：