之所以笔记一下这个，因为我在项目中经常用到。

$('.scroll_top').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);});     //页面滚动至顶部

$('.scroll_a').click(function(){$('html,body').animate({scrollTop:$('.a').offset().top}, 800);});    //页面滚动至指定的位置

$('.scroll_bottom').click(function(){$('html,body').animate({scrollTop:$('.bottom').offset().top}, 800);});   //页面滚动到底部

js-点击按钮页面滚动到顶部，底部，指定位置的更多相关文章

  1. jQuery-点击按钮页面滚动到顶部，底部，指定位置

    $('.scroll_top').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);}); //页面滚动至顶部 $('. ...

  2. js平滑滚动到顶部,底部,指定地方

    [原文链接] 采用锚点进行页面中的跳转的确很方便,但是要想增加网页的效果,可以使用jquery中的animate,实现滚动的一个动作,慢慢的滚动到你想跳转到的位置,从而看起来会非常高大上. [示例演示 ...

  3. html网页中 点击按钮页面跳转

    在html页面中 实现点击按钮页面跳转.语句如下: <input type="button" value="跳转" onClick="windo ...

  4. Headroom.js – 快速响应用户的页面滚动操作

    Headroom.js 是一个轻量级,高性能的JS插件(无依赖性!),允许你响应用户的滚动行为.Headroom.js 使您能够在适当的时候把元素融入视图,而其它时候让内容成为焦点.Headroom. ...

  5. [jquery]判断页面滚动到顶部和底部（适用于手机web加载）

    //判断页面滚动到顶部和底部 $(window).scroll(function(){ var doc_height = $(document).height(); var scroll_top = ...

  6. js原生 + jQuery实现页面滚动字幕

    js原生/jQuery实现页面滚动字幕效果 17:45:49 在新闻列表或者文章列表信息等页面中很容易要求实现字幕滚动的效果,以下为简单的实现页面中滚动字幕的效果 1.jQuery实现页面滚动字幕效果 ...

  7. js和jquery实现页面滚动监听

    js和jquery实现页面滚动监听 一.总结 一句话总结:onscroll方法和监听页面元素的高度都可以实现滚动监听. 1.onscroll方法实现滚动监听的核心代码是什么? <body ons ...

  8. js开启和关闭页面滚动【亲测有效】

    在移动端的页面开发过程中,经常会遇到点击弹框禁止页面滚动的情景,下面就来说下具体的做法... 第一步:构建一个函数 function bodyScroll(event){ event.preventD ...

  9. 使用JavascriptExecutor将页面滚动到最底部

    使用如下代码,将页面滚动到最底部 @Test(enabled = true) public void scroll(){ String jsStr="window.scrollTo(0,do ...

随机推荐

  1. .Net Core依赖注入中TryAddEnumerable 和TryAddTransient方法的区别

    .Net Core依赖注入添加的每个服务,最终都会转换为一个ServiceDescriptor的实例,ServiceDescriptor包含以下属性: Lifetime:服务的生命周期(Singlet ...

  2. leetcode-5-basic

    解题思路: 设两个变量land和sink,land的值是1的数量,sink表示内部的边.result = land*4-sink*2.按行扫描得到land, 同时得到同一行中内部边的数目:然后按列扫描 ...

  3. CentOS7.2下Hadoop2.7.2的集群搭建

    1.基本环境: 操作系统: Centos 7.2.1511 三台虚机: 192.168.163.224  master 192.168.163.225  node1 192.168.163.226   ...

  4. loadView、viewDidLoad及viewDidUnload的关系(转)

    本文目录 一.loadView 二.viewDidLoad 三.viewDidUnload 四.三个方法的关系 标题中所说的3个方法,都是UIViewController的方法,跟UIViewCont ...

  5. 网络流之Dinic算法

    初学网络流.存一下Dinic板子. 复杂度O(n^2*m) UVA - 1515 Pool construction 把每个草地与 S 相连,花费为dig,每个洞与 T 相连,花费为 然后对于每个两个 ...

  6. 妹子图爬取__RE__BS4

    妹子图爬取 页面链接 感谢崔大佬: 原文链接 正则实现代码: import requests import re import os import random class mzitu(): def ...

  7. gdb调试手册 一 gdb概述

    一 gdb概述 gdb调试器的目的是让你了解其他的程序在执行的时候发生了什么或者其他程序崩溃时正在做什么 gdb主要能够在运行中做四类事情(包括这些事情中的一些附加的事情)来帮助你获取bugs a 运 ...

  8. Python面向对象（组合、菱形继承、多态）

    今日内容: 1.组合 2.菱形继承 3.多态与多态性 昨天内容重点回顾: 1)调用也叫实例化:发生了2件事  1.创造空对象  2.触发对象下的__init__方法,然后将p连同参数一同传给init  ...

  9. IO Streams：字节流

    简介 程序使用字节流来执行8位字节的输入和输出.所有字节流类都继承于InputStream和OutputStream. 有很多字节流类:为了说明字节流如何工作,我们将重点关注文件I / O字节流Fil ...

  10. DS博客作业06——图

    1.本周学习总结(0--2分) 1.思维导图 2.谈谈你对图结构的认识及学习体会. 这章学习了图,学习了图的两种存储结构:邻接矩阵和邻接表.这两种存储结构都用到了之前学c时学到的结构体,将结构体充分运 ...