一、加载jQuery库(要求1.4以上版本)
二、在jQuery后添加如下代码:
<script type="text/javascript" src="<?php bloginfo('template_directory');?>/js/gotop.js"></script>
其中gotop.js文件内容如下:
(function() { var $backToTopFun = function() { var st = jQuery(document).scrollTop(), winh = jQuery(window).height(); (st > 0) ? jQuery(".gotop").show() : jQuery(".gotop").hide(); // IE6下的定位 if (!window.XMLHttpRequest) { $backToTopEle.css("top", st + winh - 166); } }; jQuery(document).ready(function() { jQuery(".gotoptxt").click(function() { jQuery("html, body").animate({ scrollTop : 0 }, 800); }); jQuery(window).bind("scroll", $backToTopFun); $backToTopFun(); }); })();
(3)在footer.php中添加如下代码
<div class="gotop"> <div class="gotoptxt">返回顶部</div> </div>
(4)在style.css文件中添加如下代码
/*go_top*/ .gotop{ display:none; position:fixed; bottom:120px; left:50%; } .gotoptxt{ width:18px; line-height:1.2; padding:5px 0; background-color:#000; color:#fff; font-size:12px; text-align:center; position:relative; left:485px; cursor:pointer; opacity:.6; filter:Alpha(opacity = 60); }