返回顶部 3.1版本之后请到这个地方查看文档

温馨提醒:无需html代码,只需引入JS即可

CSS代码

.toTop{position:fixed;bottom:10px;right:20px; z-index:999;display:none; font-size:16px;cursor: pointer;overflow:hidden;visibility:visible; background-color:#fff;border: 1px solid #d9d9d9;color: #9c9c9c;font-size: 16px;width: 38px;height: 38px;line-height: 38px;text-align: center; text-decoration:none;_position:absolute;_top:expression(documentElement.scrollTop + documentElement.clientHeight-this.offsetHeight)}
.toTop:hover{ color:#fff; text-decoration:none; background-color:#999}

JS代码

引入jQuery

<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
var $backToTopEle=$('<a href="javascript:void(0)" class="Hui-iconfont toTop" title="返回顶部" alt="返回顶部" style="display:none">&#xe684;</a>').appendTo($("body")).click(function(){
$("html, body").animate({ scrollTop: 0 }, 120);
});
var backToTopFun = function() {
var st = $(document).scrollTop(), winh = $(window).height();
(st > 0)? $backToTopEle.show(): $backToTopEle.hide();
/*IE6下的定位*/
if(!window.XMLHttpRequest){
$backToTopEle.css("top", st + winh - 166);
}
};

注意: 如果页面中引用了h-ui.js,无需重复粘贴上面脚本代码。

请在要使用返回顶部的页面上加入下面代码进行调用:

$(function(){
  $(window).on("scroll",backToTopFun);
  backToTopFun()});

Copyright ©2013-2022 H-ui.net All Rights Reserved.
豫ICP备19019279号-1
H-ui只是一个纯web前端的程序,没有后台和数据库,也不提供任何系统代运营服务。所有使用H-ui开发的任何系统版权都归开发者所有,造成的任何损失、不良影响,H-ui均不承担任何法律责任。
未经允许,禁止转载、抄袭、镜像
用心做站,做不一样的站