实现点击到底部、顶部、指定div功能
顶部:
$(".back_top").click(function () {
scrollTo(0, 0);
});
function goTop() {
$('html, body').animate({scrollTop:0}, 'slow');
}
底部:
$(".back_bottom").click(function () {
$('html,body').animate({ scrollTop: document.documentElement.scrollHeight }, 800);
});
function goBottom(){
window.scrollTo(0, document.documentElement.scrollHeight-document.documentElement.clientHeight);
}
指定div:
function goDiv(div) {
var a = $("#"+div).offset().top;
$("html,body").animate({scrollTop:a}, 'slow');
}
实现点击到底部、顶部、指定div功能的更多相关文章
- 固定顶部指定div不滑动
.fixed_div { position:fixed; z-index:100; top: 45px; width:100%; height:45px; } 指定div设置属性position:fi ...
- [js常用]页面滚动的顶部,指定位置或底部,平滑滚动
js平滑滚动到顶部.底部.指定地方 <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- web自动化,下拉滚动到底部/顶部和下拉滚动到指定的元素
在web自动化,经常会遇到页面显示内容太多的时候,页面就会出现滚动条,一般有两种方式进行下拉,一种是直接下拉到底部/顶部/中部,或者直接给定元素,直接下拉到指定元素的位置. 两种方式的共同点: 两种方 ...
- Web前端 页面功能——点击按钮返回顶部的实现方法
1. 最简单的静态返回顶部,点击直接跳转页面顶部,常见于固定放置在页面底部返回顶部功能 方法一:用命名锚点击返回到顶部预设的id为top的元素 html代码 <a href="#top ...
- jquery实现点击上移到顶部功能(转)
---恢复内容开始--- 本文转载自W3CPLUS, jQuery制作go to top按钮 每每看到网友Blog的页面底部或中间有一个按钮回到页面顶部,羡慕死人了,但自己就是做不出这样的效果.后来在 ...
- 【JQ+锚标记实现点击页面回到顶部】
前言:今天想写个页面常用到的[点击回到页面顶部或是首页的功能],生活和职场一样,总会有低谷的时候,这个时候咱也别怂.别怂.别怂,说三遍!那都不是事,工作没了,再找呗,就像我上周五,团队解散那天,我是笑 ...
- Servlet跳转到Jsp的指定div
问题: 首页点击一个连接,切换div(id = cc_bi) <div id="K_a"> <a href ...
- JS——BOM操作(点击按钮返回顶部案例:scrollTop的用法)
点击按钮返回顶部案例: 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- iOS点击状态栏回到顶部底层实现原理
在iOS开发中,苹果其实已经帮你实现了点击状态栏回到顶部这个功能,但我们在开发中会遇到点击不能回到顶部.其实这都和 ScrollView中的一个属性scrollsToTop有关,我们先看看苹果关于这个 ...
随机推荐
- 自定义圆角ImageView控件
这个就当工具类用吧,因为直接是继承的ImageView.所以也具备了ImageView所有的特点,不同的是,可以自动裁剪成圆角图片.看效果吧. 效果还是不错的.使用方式: 直接在配置中添加依赖 com ...
- Android Dialog的整个生命周期
Activities提供了一种方便管理的创建.保存.回复的对话框机制,例如 onCreateDialog(int), onPrepareDialog(int, Dialog), showDialog( ...
- canvas验证码 - 随机字母数字
基于canvas制作随机生成数字英文组合验证码效果,点击或刷新会自动重组.输入验证码提交验证效果代码. <div class="verification"> <i ...
- 实现serializable接口的作用
最重要的两个原因是: 1.将对象的状态保存在存储媒体中以便可以在以后重新创建出完全相同的副本: 2.按值将对象从一个应用程序域发送至另一个应用程序域. 实现serializable接口的作用是就是可以 ...
- 转载:http://www.cnblogs.com/double-K/p/6926367.html
sql专家感悟:不可说的感悟-——十年老技术转型(一) http://www.cnblogs.com/double-K/p/6926367.html
- leetcode 之 Same Tree
1.题目描述 Given two binary trees, write a function to check if they are the same or not. Two binary tre ...
- Sun Solairs系统添加裸设备
Sun Solaris系统添加裸设备对表空间进行扩容的大体操作步骤. 1.查看当前卷组信息 --查看当前卷组信息#vxdg list --查看当前卷组中物理磁盘的使用情况#vxdg free |gre ...
- SQLSERVER性能计数器的简单剖析
SQLSERVER性能计数器的简单剖析 今晚看了这篇文章:SQL Server 2012新performance counter:非常实用的Batch Resp Statistics 文章里介绍到SQ ...
- git repo代码部署策略及工具
一般在项目或者产品开发流程中,先是开发人员在本地做好开发及测试,其中可能包含很多用于测试用的目录以及源代码文件,在部署前往往会有一个build过程.web项目最终build产生出优化生产环境下减少ht ...
- 51nod 1443 路径和树(最短路)
题目链接:https://www.51nod.com/onlineJudge/questionCode.html#!problemId=1443 1443 路径和树 题目来源: CodeForces ...