<style>
.divH {
height: 1800px;
}
.divT {
width: 50px;
height: 50px;
font-size: 18px;
background-color: #2F4F4F;
text-align: center;
color: white;
position: fixed;
right: 18px;
bottom: 18px;
}
.divT:hover{
cursor: pointer;
}
.hide {
display: none;
}
</style>
</head>
<body>
<div class="divH"></div>
<div class="divT hide" onclick="ReturnTop();"><strong>返回顶部</strong></div> <script src="./jq/jquery-1.9.1.min.js"></script>
<script>
window.onscroll = function () {
var current = $(window).scrollTop();
if (current > 180){
$(".divT").removeClass("hide");
}else {
$(".divT").addClass("hide");
}
}; function ReturnTop() {
$(window).scrollTop(0);
}
</script>

网页右下角有个返回顶部按钮,模仿淘宝?window.scrollTop()方法

js返回顶部小Demo的更多相关文章

  1. 添加“返回顶部”小图标按钮的JS(JavaScript)代码详解

    如何给自己的网站添加方便快捷的"返回顶部"小图标按钮呢?如下图: JS源代码: /** * JavaScript脚本实现回到页面顶部示例 * @param acceleration ...

  2. js返回顶部封装 简洁

    js返回顶部封装 简洁: 加入html页面body最后面即可. <script> a(); function a() { $(function() { if ($(".j-to- ...

  3. JS 带运动的返回顶部 小案例

    带运动的返回顶部:当滚动条在滚动的时候,滚动鼠标的滚轮,应该让滚动条停止滚动,清掉定时器.下面的方法b 就是清掉的方法 <!DOCTYPE html PUBLIC "-//W3C//D ...

  4. 原生js返回顶部(匀速、由快到慢)

    在项目中我们经常有需求要求页面滚动到一定位置时出现返回顶部按钮,点击即返回顶部. 方法一: 锚点,这是最简单的.(a标签的href属性等于一直要到达位置元素的id值) 方法二: js直接给页面根节点设 ...

  5. js返回顶部效果

    当用户浏览的网页过于长的时候,用户在浏览到网页底部想要在返回顶部需要滚动好几次滚轮才能返回顶部,不仅麻烦,而且用户体验也会很差.现在的大多是页面都会在页面顶部或者是页面的可见区域的某一位置固定一个按钮 ...

  6. js返回顶部

    1. function scrollTop(){ $(},); } 2. $("#side-bar .gotop").click(function(){ $(},); //返回顶部 ...

  7. 原生JS返回顶部,带返回效果

    有些网站当滑到一定高度时右下角会有一个按钮,你只要一点就可以直接返回顶部了.那这个功能是怎么做到的呢.其实不算太难: 首先我们先在网页中创建一个按钮,上面写上返回顶部,把它的样式改成固定定位,之后想要 ...

  8. js 返回顶部

    <script> window.onload = function(){ var oTop = document.getElementById("to_top"); v ...

  9. Asp.Net Mvc+Angular.Js自测小Demo

    参考:http://www.cnblogs.com/eedc/p/6082052.html 一.引用anguler: 1.angular.js 2.angular-route.js 3.app.js ...

随机推荐

  1. ed-tue-robotics

    https://github.com/tue-robotics/ed ubuntu16.04 安装libsdformat4-dev ,libsdformat4 1./usr/include/sdfor ...

  2. Sass函数:Sass Maps的函数-map-get($map,$key)

    map-get($map,$key) 函数的作用是根据 $key 参数,返回 $key 在 $map 中对应的 value 值.如果 $key 不存在 $map中,将返回 null 值.此函数包括两个 ...

  3. torchvision.transforms模块介绍

    torchvision.transforms模块 官网地址:https://pytorch.org/docs/stable/torchvision/transforms.html# torchvisi ...

  4. java基础复习(一)

    一.常用的DOS命令  打开命令提示符窗口的方式: ① win + R --> 输入cmd --> 回车 ② 开始 --> 搜索程序和文件的框中输入  cmd  --> 回车 ...

  5. Ubuntu16.04安装x11VNC远程桌面

    1. 安装x11vnc sudo apt-get install x11vnc 2. 设置密码 x11vnc -storepasswd 3. 修改配置文件 sudu vim /lib/systemd/ ...

  6. 【leetcode】981. Time Based Key-Value Store

    题目如下: Create a timebased key-value store class TimeMap, that supports two operations. 1. set(string ...

  7. Sublime Text 快捷键汇总

    1. 常用快捷键 Ctrl+D 选词 (反复按快捷键,即可继续向下同时选中下一个相同的文本进行同时编辑)Ctrl+G 跳转到相应的行Ctrl+J 合并行(已选择需要合并的多行时)Ctrl+L 选择整行 ...

  8. python3用pygame实现播放音乐文件

    import pygameimport time #导入音乐文件file = r'C:\1.wav'pygame.mixer.init()track = pygame.mixer.music.load ...

  9. 一款易用、高可定制的vue翻页组件

    一款易用.高可定制的vue翻页组件 在线体验:pages.cixi518.com 使用 npm i vo-pages --save vo-pages组件父元素必须设置固定高度并填写属性overflow ...

  10. Linux系统重要文件(三)

    一系统运行级别文件 文件路径:/etc/inittab 文件作用说明:定义系统启动后,自动开启哪些软件程序系统 runlevel 查看当前运行级别 centos6系统运行级别: 7个级别      0 ...