$('.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);});   //页面滚动到底部

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

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

    之所以笔记一下这个,因为我在项目中经常用到. $('.scroll_top').click(function(){$('html,body').animate({scrollTop: '0px'}, ...

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

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

  3. [jquery]判断页面滚动到顶部和底部(适用于手机web加载)

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

  4. 用jquery实现平滑的页面滚动效果

    通过几句jquery代码实现页面平滑滚动到某一锚点的效果.实现代码来源于https://css-tricks.com/snippets/jquery/smooth-scrolling 实现的jquer ...

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

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

  6. jQuery滚动条回到顶部或指定位置

    jQuery滚动条回到顶部或指定位置 在很多网站,为了增强用户体验,我们会看到回到顶部的按钮,不用手动拖拽滚动条就能回到顶部,非常方便.下面就介绍用jquery实现的滚动到顶部的代码 $(functi ...

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

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

  8. [RN] React Native 滚动跳转到指定位置

    React Native 滚动跳转到指定位置 一.结构 <ScrollView horizontal={true} ref={(view) => { this.myScrollView = ...

  9. [HTML/JS] JQuery 页面滚动回到顶部

    HTML: <html> <body> <div id="back-to-top" style="cursor:pointer; displ ...

随机推荐

  1. Nowcoder 练习赛26 D xor序列 ( 线性基 )

    题目链接 题意 : 中文题.点链接 分析 : 对于给定的 X 和 Y 假设存在一个 Z 使得 X (xor) Z = Y 做一个变形 X (xor) Z (xor) Y = 0 X (xor) Y = ...

  2. javascript中继承方式及优缺点(二)

    一.原型链继承 方式1: 原型链继承 (1)流程: ​ 1.定义父类型构造函数. ​ 2.给父类型的原型添加方法. ​ 3.定义子类型的构造函数. ​ 4.创建父类型的对象赋值给子类型的原型. ​ 5 ...

  3. Makefile文件试错

    1成功: src = $(wildcard ./*cpp) obj = $(patsubst %.cpp,%.o ,$(src)) target = test $(target) : $(obj) g ...

  4. confluence部署

    confluence -- 团队文档的管理平台. 首先要在confluence官网买key. 部署 安装jdk 1.8 环境 查看机器是否自带 java -version,没有再安装. yum ins ...

  5. Alibaba DataX 源码编译

    Alibaba DataX 源码编译 标签(空格分隔): ETL DataX简介 设计理念 为了解决异构数据源同步问题,DataX将复杂的网状的同步链路变成了星型数据链路,DataX作为中间传输载体负 ...

  6. python3笔记三:运算符与表达式

    一:学习内容 算术运算符:+(加).-(减).*(乘)./(除).%(取模).**(求幂).//(取整) 赋值运算符:= 复合运算符:+=.-=.*=./=.%=.**=.//= 位运算符:& ...

  7. 客户端浏览器向服务器发起http请求的全过程

    http协议的参考:http://blog.csdn.net/hefeng6500/article/details/75081047 (1)浏览器先搜索自身的DNS缓存 (2)操作系统搜索自身的DNS ...

  8. LeetCode 34. 搜索范围(search for a range)

    题目描述 给定一个按照升序排列的整数数组 nums,和一个目标值 target.找出给定目标值在数组中的开始位置和结束位置. 你的算法时间复杂度必须是 O(log n) 级别. 如果数组中不存在目标值 ...

  9. MongoDB与mysql的对比

    1.与Mql对照 MySQL MongoDB 说明 mysqld mongod 服务器守护进程 mysql mongo 客户端工具 mysqldump mongodump 逻辑备份工具 mysql m ...

  10. 【MAC】安装chrome浏览器

    step1:下载dmg安装包 chrome下载地址 点击[下载Chrome] step2:安装chrome 下载好googlechrome.dmg文件后,像其它程序一样安装就可以了 打开访达--> ...