jquery返回页面顶部
1、此博文图片样式引用腾讯网站,效果如下:

2、样式设置:
#toTop {
/*选中的背景图片的大小*/
width: 54px;
height: 54px;
display: none;/*刚开始不显示*/
position: fixed;
right: 25px;/*距离右边大小值*/
bottom: 45px;/*距离底部大小值*/
/*选定图片区域*/
background-image: url(images/qqbg_1.5.5.png);
background-repeat: no-repeat;
background-position: -700px -110px;
opacity: 0.3; /*透明度*/
}
#toTop:hover {
opacity: ;/*悬停时不透明*/
filter: alpha(opacity = );
}
3、JS代码:
<a href="#" target="_self" id="toTop" title="返回顶部" onclick="window.scrollTo(0,0);return false"></a>
<script type = "text/javascript">
function toTopHide(){
$(document).scrollTop()>?
$("#toTop").show()
:$("#toTop").hide();
}
$(window).scroll(function(){toTopHide()});
</script>
jquery返回页面顶部的更多相关文章
- 代码: 返回页面顶部 jquery
jquery代码: 返回页面顶部 <script type="text/javascript" src="http://cdn.bootcss.com/jquery ...
- jquery返回滚动条顶部
var $view = $('html,body'),$backTop = $('#backTop'), $backTop.on('click',function(){ $view.animate({ ...
- react-router(v4) 路由跳转后返回页面顶部问题
遇到的问题 由A页面跳转到B页面,B页面停留在A页面的位置,没有返回到顶部. 问题分析 首先分析下出现此问题的原因: 在项目中使用的是 hashHistory,它是建立在 history 之上的,当路 ...
- HTML5商城开发五 实现返回页面顶部
本文内容主要是网上参考收集,介绍四种简单的返回页面顶部代码,可以使用简单的HTML锚标记,也可使用Javascript Scroll函数动态返回等等. 一.使用锚标记返回页面顶部 使用HTML锚标记最 ...
- jquery实现返回页面顶部功能。
<p id="back-to-top"> <span></span> </p> <script type="text ...
- js网页返回页面顶部的小方法
咳咳,在网页出现滚动条的时候,许多网站会在右下角出现一个图标,点击可以回到页面顶部 本文就记录下js实现代码: 1.在html页面body添加dom元素 <img src="toTop ...
- 【jQuery】页面顶部显示的进度条效果
<!Doctype html> <html> <head> <title>页面顶部显示的进度条效果</title> <meta htt ...
- 解决点击a标签返回页面顶部的问题
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- (转)解决点击a标签返回页面顶部的问题
本文转载至http://www.cnblogs.com/chenluomenggongzi/p/5950670.html 1 <!DOCTYPE html> 2 <html lang ...
随机推荐
- Hibernate非主键一对多关联。
Unit表 id,code User表 id,ucode ...@ManyToOne(fetch = FetchType.LAZY) @JoinColumn(name="ucode" ...
- 简易selenium自动化测试框架(Python)
最近空闲时间在探索Selenium的自动化测试,简单的写了一个小框架来测试公司的一个web产品.该框架包括以下模块: 1. Test case编写模式(page模式,参考之前的博文http://www ...
- 微信小程序开发(1) 天气预报
本文介绍如何使用微信小程序开发天气预报功能. 一.项目文件列表 二.小程序配置 使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置多 tab 等. ...
- 破解WPA工具Tkiptun-ng
1.关于Tkiptun-ng 该工具能够将一些帧插入到使用WPA TKIP且开启Qos的无线网络中. 2.Tkiptun-ng原理 Tkiptun-ng设计思路主要是通过获得一个包含明文与MIC(消息 ...
- luogu 1314 欧拉回路
欧拉路径:一笔画的路径 欧拉回路:一笔画的回路 两者判断方法一样但是输出略有不同.并且还有Fleury(弗罗莱)算法,但是我不会.. 这里就用dfs就好 判断条件: 1)图的连通性(可用并查集判断) ...
- golang string int int64转换
#string到int int,err:=strconv.Atoi(string) #string到int64 int64, err := strconv.ParseInt(string, 10, 6 ...
- rest framework错误笔记——AssertionError: Cannot apply DjangoModelPermissionsOrAnonReadOnly on a view that does not set `.queryset` or have a `.get_queryset()` method.
用到@api_view装饰器时,访问路由查看api数据时,报错: AssertionError: Cannot apply DjangoModelPermissionsOrAnonReadOnly o ...
- CF418D Big Problems for Organizers
传送门 题意,给一棵树,每次给两个点\(x,y\),求\(\max_{i=1}^{n}(\min(di_{x,i},di_{y,i}))\) 看std看了好久 以下是一个优秀的在线做法,\(O(nlo ...
- $PollardRho$ 算法及其优化详解
\(PollardRho\) 算法总结: Pollard Rho是一个非常玄学的算法,用于在\(O(n^{1/4})\)的期望时间复杂度内计算合数n的某个非平凡因子(除了1和它本身以外能整除它的数). ...
- 出现fonts/fontawesome-webfont.woff?v=4.5.0 net::ERR_ABORTED
虽然网页正常显示和运行,但是有2个字体文件出现404错误. 原因:服务器没有配置MIME类型而已. 1. 在IIS网站中,找打网站对应的MIME类型,双击. 2.能看到此网站对应的MIME类型,点击右 ...