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

$('.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. Linux-CentOS6.9启动流程排错

    1 . CentOS6.9启动流程 POST 加电自检,是BIOS功能的一个主要部分.负责完成对CPU.主板.内存.硬盘子系统.显示子系统.串并行接口.键盘.CD-ROM光驱等硬件情况的检测. Boo ...

  2. python入门:输出1-10以内除去7的所有数(自写)

    #!/usr/bin/env python # -*- coding:utf-8 -*- #输出1-10以内除去7的所有数(自写) """ 变量kaishi赋值等于1,w ...

  3. MySQL查询时,查询结果如何按照where in数组排序

    MySQL查询时,查询结果如何按照where in数组排序 在查询中,MySQL默认是order by id asc排序的,但有时候需要按照where in 的数组顺序排序,比如where in的id ...

  4. 【mysql】mysql 备份脚本

    #! /bin/bash   HOST=localhost USER=root PASSWORD=password DATE_STR=$(date '+%F--%T') ERROR_LOG=/usr/ ...

  5. Survey lists 10 most innovative cities

    From China Daily Beijing and Shanghai are among the 10 most innovative cities in the world, based on ...

  6. LeetCode(134) Gas Station

    题目 There are N gas stations along a circular route, where the amount of gas at station i is gas[i]. ...

  7. 蓝桥--2n皇后问题(递归)--搬运+整理+注释

    N皇后问题: #include <iostream> #include <cmath> using namespace std; int N; ];//用来存放算好的皇后位置. ...

  8. Centos7重启网卡失败解决方法

    service Network-Manager stop  执行命令解决,如果执行命令还是失败,则是配置文件内容的问题,检查配置文件

  9. BZOJ 4355: Play with sequence

    调了好久,还是黑盒测试有前途 我以前怕不是学了假的吉利线段树(我第一次知道还要记次小值去更新的........) #include<cstdio> #include<algorith ...

  10. Python包和日志模块

    1.什么是包    包是模块的一种形式,包的本质就是一个含有__init__.py文件的文件夹 2.为什么要有包 提高开发人员维护性 3.如何用包    导入包就是在导包下的__init__.py   ...