仿CSDN Blog返回页面顶部功能
只修改了2个地方:
1,返回的速度-->改成了慢慢回去。(原来是一闪而返回)
2,返回顶部图标出现的时机-->改成了只要不在顶部就显示出来。(原来是向下滚动500px后才显示)
HTML:
Javascript代码
<script type="text/javascript">
if(scrTop>500){
if(scrTop>0){
//scrollTo(0,0);
this.blur();
CSS样式
355 position: fixed;
357 float: right;
358 z-index: 10;
359 right: 10px;
360 bottom: 40px;
361 }
362 #d-top img {
363 width: 42px;
364 opacity: 0.3;
365 }
366 img {
367 border: medium none;
368 }
仿CSDN Blog返回页面顶部功能的更多相关文章
- jquery实现返回页面顶部功能。
<p id="back-to-top"> <span></span> </p> <script type="text ...
- HTML5商城开发五 实现返回页面顶部
本文内容主要是网上参考收集,介绍四种简单的返回页面顶部代码,可以使用简单的HTML锚标记,也可使用Javascript Scroll函数动态返回等等. 一.使用锚标记返回页面顶部 使用HTML锚标记最 ...
- react-router(v4) 路由跳转后返回页面顶部问题
遇到的问题 由A页面跳转到B页面,B页面停留在A页面的位置,没有返回到顶部. 问题分析 首先分析下出现此问题的原因: 在项目中使用的是 hashHistory,它是建立在 history 之上的,当路 ...
- 代码: 返回页面顶部 jquery
jquery代码: 返回页面顶部 <script type="text/javascript" src="http://cdn.bootcss.com/jquery ...
- js网页返回页面顶部的小方法
咳咳,在网页出现滚动条的时候,许多网站会在右下角出现一个图标,点击可以回到页面顶部 本文就记录下js实现代码: 1.在html页面body添加dom元素 <img src="toTop ...
- 解决点击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 ...
- 解决点击空<a>标签返回页面顶部的问题
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jquery返回页面顶部
1.此博文图片样式引用腾讯网站,效果如下: 2.样式设置: #toTop { /*选中的背景图片的大小*/ width: 54px; height: 54px; display: none;/*刚开始 ...
随机推荐
- oracle触发器中增删改查本表
oracle触发器中增删改查本表 (1)只有before insert触发器中才可以查询或更新本表 create or replace trigger tri_test_ins before inse ...
- c++ anonymous union,struct -- 匿名联合体和机构体
c++ anonymous union,struct -- 匿名联合体和机构体 结构体和联合体各自的基本用法不赘述,仅说一下他们匿名时访问的情况.如果是token不同,可以直接跨层访问.例子 #inc ...
- ios捕获异常并发送图片,便于解决bug
在开发过程中,我们有时候会留下Bug,用户在使用我们的app 的时候,有时会出现闪退,这时候我们能够让用户给我们发送邮件,以让我们开发者更加高速的地位到Bug的所在.以最快的时间解决.同一时候也提高用 ...
- QML中多样化的ListModel(MultiDelegate)
在QML的官方例子里面, 基本上都是一样的Delegate, 也就是说不管数据怎样, 样式都是不变的. 如果我们想要根据不同的数据类型来显示不同的UI该怎么办? 这里有一个例子. DataBank L ...
- 获取sina,baidu,google财经历史和实时股票数据接口
实时股票数据接口 股票数据的获取目前有如下两种方法可以获取:1. http/javascript接口取数据2. web-service接口1.http/javascript接口取数据1.1Sina股票 ...
- 《sql---教学反馈系统-阶段项目1》
--修改列 --把 "Address" 栏位改名为 "Addr".这可以用以下的指令达成: --ALTER table customer change Addr ...
- Oracle Enterprise Manager Cloud Control 12c R4 安装配置
准备软件 em12.1.0.4_linux64_V45344-01.zip em12.1.0.4_linux64_V45345-01.zip em12.1.0.4_linux64_V45346-01. ...
- The absolute uri: http://java.sun.com/jsp/jstl/core cannot be resolved in either web.xml or the jar
出现 The absolute uri: http://java.sun.com/jsp/jstl/core cannot be resolved in either web.xml or the j ...
- STM32 + RT Thread OS 学习笔记[四]
1. 补注 a) 硬件,打通通讯通道 若学习者购买了学习板,通常可以在学习板提供的示例代码中找到LCD的相关驱动代码,基本上,这里的驱动的所有代码都可以从里面找到. 从上面的示意图可见,M ...
- 008实现一个算法从一个单链表中返回倒数第n个元素(keep it up)
我们维护两个指针, 它们之间的距离为n. 然后.我将这两个指针同步地在这个单链表上移动,保持它们的距离 为n不变. 那么, 当第二个指针指到空时.第一个指针即为所求. #include <ios ...