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

$('.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. django开发之model篇-Field类型讲解

    今天介绍一下django开发中,定义模型时用到的相关字段类型和字段选项. 先说说常用的字段类型:1) AutoField: 自增字段类型,当自定义自增类型的id时,可以使用此类型:2) BigAuto ...

  2. PHP分页类代码

    今天为大家献上一段代码,这是一段php分页代码: <?php//创建分页类class Page {    private $_all_num;                           ...

  3. 收集的有关mdk 3的使用方法

      收集来自网络上的有关mdk3的一些使用方法以及技巧(持续更新) b beacon泛洪攻击 -f 指定wifi名称的文件夹 -n 加上wifi名称 -w Fake WEP encrypted sta ...

  4. perl-basic-数组操作

    RT...直接看代码 my @stack = ("Fred", "Eileen", "Denise", "Charlie" ...

  5. JAVA基础篇—抽象类，抽象方法

    class Shape package com.shape; public abstract class Shape { double area;// double per;// String col ...

  6. NordicSemiconductor.nRF_DeviceFamilyPack 更新历史记录

    Version: 8.17.0 (2018-04-27) NordicSemiconductor.nRF_DeviceFamilyPack.8.17.0.packDownload For nRF528 ...

  7. bash的位置变量和特殊变量

    bash编程的知识点:位置变量和特殊变量 位置参数变量:         scirpt1.sh arg1 arg2 ...         $0         $1   $2   ...  ${10 ...

  8. luogu2123 皇后游戏

    好题. 网上看到的范围是:\(T \leq 10\),$ n \leq 50000$, $ a_i,b_i \leq 10^9$. 我们按照贪心惯常的思路考虑交换相邻的两个人.容易发现,对于相邻的两个 ...

  9. jmeter非常好的博客收藏

    http://blog.sina.com.cn/s/blog_56c9b55c010148os.html

  10. 如何解决border的重叠问题

    我现在在做一个ul列表,然后给每个li加上边框,但是加完了之后,相邻列表的边框就会变成2px,比如第一个li的下边框和第二个li的上边框就会重叠在一起,请问这有什么办法解决一下么? 解决方法是: 试试 ...