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

$('.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. HDU:1269-迷宫城堡(tarjan模板)

    迷宫城堡 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Problem Descri ...

  2. SPOJ 375 树链剖分 QTREE - Query on a tree

    人生第一道树链剖分的题目,其实树链剖分并不是特别难. 思想就是把树剖成一些轻链和重链,轻链比较少可以直接修改,重链比较长,用线段树去维护. 貌似大家都是从这篇博客上学的. #include <c ...

  3. Django基于Pycharm开发之二 [使用django adminSite]

    在使用django自带的adminsite的时候,有以下内容需要做. 1.数据迁移,管理表的创建. 2.启用本地化 (setting.py的配置) 一.数据迁移,默认情况下,安装django之后,dj ...

  4. spring boot 启动慢的原因

    停留在Spring logo那里差不多4分钟 SpringBoot启动慢的原因应该是某些应用占用了spring config server默认的端口8888,然后SpringCloud进程有些引用了s ...

  5. Leetcode4--->求两个排序数组的中位数

    题目:给定两个排序数组,求两个排序数组的中位数,要求时间复杂度为O(log(m+n)) 举例: Example 1: nums1 = [1, 3] nums2 = [2] The median is ...

  6. linux随笔三

    1.ps   结果输出: PID TTY TIME CMD pts/ :: bash pts/ :: ps显示了程序的进程ID,其运行的终端和进程使用的cpu时间

  7. 【LeetCode】Reverse Integer(整数反转)

    这道题是LeetCode里的第7道题. 题目描述: 给出一个 32 位的有符号整数,你需要将这个整数中每位上的数字进行反转. 示例 1: 输入: 123 输出: 321  示例 2: 输入: -123 ...

  8. April Fools Contest 2018

    这个比赛不正经,但是我可以一本正经的写代码啊 A. Quirky Quantifiers time limit per test 2 seconds memory limit per test 64 ...

  9. Conda相关命令的使用

    -- Conda basics Conda基础命令 conda info 查看已安装的环境 conda install PACKAGENNAME 安装包 conda update PACKAGENAM ...

  10. 【转】Unicode utf8等编码类型的原理

    原文地址http://www.cnblogs.com/daxiong2014/p/4768681.html Unicode utf8等编码类型的原理 1.ASCII码  我们知道,在计算机内部,所有的 ...