仿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;/*刚开始 ...
随机推荐
- Linux下限制Shell:Rssh和Scponly
限制Shell,正如Rsh和Scponly让系统管理员限制Linux用户可以做哪些操作,你可以创建用户,将被允许通过Scp复制文件,但不会被允许登录到系统的命令行.这是非常重要的安全功能,应考虑每个系 ...
- 回文(manacher)
裸manacher 我竟然写跪了………… 一个地方(偶数)没写清楚…… 我OOXOXOXOXXOXO #include<cstdio> #include<cstdlib> #i ...
- Ubuntu12.04创建 Eclipse launcher
Ubuntu 12.04 默认无法launcher Eclipse快捷图标到左侧Dash,需要手工配置,步骤如下: 1) 首先,创建并打开 ~/.local/share/applications/op ...
- enum可以做索引
enum可以做索引 enum可以做索引, 配上虚函数,或者函数指针,可以实现上层的统一封装和快速索引. 点击(此处)折叠或打开 MoTbl.cpp #include <stdio.h> # ...
- windows下Memcached 架设及java应用
1 Memcached 介绍 Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提供动态.数据 ...
- 指尖上的电商---(3)Solr全文搜索引擎的配置
接上篇,Solr的准备工作完毕后,本节主要介绍Solr的安装,事实上Solr不须要安装.直接下载就能够了 1.Solr配置 下载地址 :http://lucene.apache.org/so ...
- JAVA的extends使用方法
理解继承是理解面向对象程序设计的关键.在Java中,通过keywordextends继承一个已有的类,被继承的类称为父类(超类,基类),新的类称为子类(派生类).在Java中不同意多继承. (1)继承 ...
- 136 - Ugly Numbers
Ugly Numbers Ugly numbers are numbers whose only prime factors are 2, 3 or 5. The sequence 1, 2, 3 ...
- 【Matlab编程】Matlab让电脑失而复得
在学校常常有同学电脑失窃,大抵都是粗细大意.据说iPhone手机失窃后能够获取小偷的照片,从而将照片找到.如今用matlab写一个程序使得当小偷使用电脑上网时,电脑自己主动将电脑前面的人的照片发到你指 ...
- 解析php混淆加密解密的手段,如 phpjm,phpdp神盾,php威盾
原文 解析php混淆加密解密的手段,如 phpjm,phpdp神盾,php威盾 php做为一门当下非常流行的web语言,常常看到有人求解密php文件,想当年的asp也是一样.一些人不理解为什么要混淆( ...