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 ...
随机推荐
- Java内存泄露处理
https://www.cnblogs.com/likeli/p/9413830.html
- LINQ to SQL 实现 GROUP BY、聚合、ORDER BY
Ø 前言 本示例主要实现 LINQ 查询,先分组,再聚合,最后在排序.示例很简单,但是使用 LINQ 却生成了不同的 SQL 实现. 1) 采用手动编写 SQL 实现 SELECT ROW_NU ...
- TCP/IP详解 卷1 第一章概述
第一章概述 1.2 分层 网络编程通常分不同层次进行开发,每一层负责不同的通信功能. 一个协议族比如TCP/IP,通常是一组不同层次上多个协议的组合.一般可以认为是是四层协议系统: 链路层:有时也称作 ...
- Mysql高级查询 内连接和外连接详解
一.内连接(INNER JOIN) 1.等值连接 概述:指使用等号"="比较两个表的连接列的值,相当于两表执行笛卡尔后,取两表连结列值相等的记录. 语法: SELECT 列 FRO ...
- 时间轴QTimeLine
一个动画由多张静态图片组成,每一张静态图片为一帧.每隔一定时间显示一帧,如果时间间隔非常短的话,那这些静态图片就会构成一个连续影像,动画由此而来.QTimeLine提供了用于控制动画的时间轴,它在实现 ...
- Mybatis进阶学习笔记——关系查询——一对多查询
一个客户拥有多个订单 <resultMap type="User" id="UserOrderResultMap"> <id column=& ...
- windows系统中hosts文件位置
C:\Windows\System32\drivers\etc\hosts 10.0.0.213 mr1.bic.zte.com 10.0.0.2 mr2.bic.zte.com 10.0.0.102 ...
- Linux Samba服务主配文件smb.conf中文详解【转】
转自:https://blog.csdn.net/maotianwang/article/details/52524732 从网上找到描述比较详细的smb.conf中文解释: 服务名:smb 配置目录 ...
- freerradius 错误:pap: WARNING: No "known good" password found for the user
具体错误如下: 1) # Executing section authorize from file /usr/local/etc/raddb/sites-enabled/default(1) a ...
- zabbix3.0对tcp连接数和状态的监控优化
zabbix3.0对tcp连接数及状态的监控优化 之前对tcp的监控采用netstat命令,发现在服务器繁忙的时候效果不理想,这个命令占用大量的cpu有时候高达90%以上,可能会导致业务的不稳定,所以 ...