实现点击到底部、顶部、指定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有关,我们先看看苹果关于这个 ...
随机推荐
- 【Android】Retrofit 2.0 的使用
一.概述 Retrofit是Square公司开发的一个类型安全的Java和Android 的REST客户端库.来自官网的介绍: A type-safe HTTP client for Android ...
- View的setTag和getTag方法
---恢复内容开始--- public View getView(int position, View convertView, ViewGroup parent) { Msg msg =getIte ...
- 切换Fragment时实现数据保持
摘要 Fragment设计初衷是为了简化不同屏幕分辨率的开发难度,他将代表一个功能的UI及其相关数据看做一个模块,以便达到复用.可以将Fragment看作是一个可以嵌入布局中的activity,有自己 ...
- Django 路由系统URL 视图views
一.Django URL (路由系统) URL配置(URLconf)就像Django 所支撑网站的目录.它的本质是URL模式以及要为该URL模式调用的视图函数之间的映射表:你就是以这种方式告诉Djan ...
- [UI] 精美UI界面欣赏[6]
精美UI界面欣赏[6]
- 山寨今日头条的标题title效果
山寨今日头条的标题title效果 效果: 源码: // // ViewController.m // 今日头条 // // Created by YouXianMing on 14/11/26. // ...
- Ogre学习教程:Ogre1.8.1+VS2010环境配置2(转)
之前按照前面一篇文章提到的部署了ogre1.9,后来查询资料,有的提到关于vs2010还是安装ogre1.8比较稳定,由于是小白,又比对着几篇文章重新配置了一遍. 从一开始的什么都不会,到现在能知道每 ...
- 五十个小技巧提高PHP执行效率
在项目开发过程中,经常遇到了一些PHP处理程序性能底下的情况,程序运行在centos+nginx环境,虽然这个有很多的原因如:服务器本身配置,运行环境nginx服务,php-fpm配置等等,更多有一点 ...
- zabbix的日常监控-磁盘性能监控(十二)
监控磁盘的性能 参考文章: https://wiki.enchtex.info/howto/zabbix/zabbix_iostat_monitoring https://blog.csdn.net/ ...
- 最新版本2018.1.1webstorm安装、汉化、破解教程
一.安装(下载与激活) 1.官网下载安装包https://www.jetbrains.com/webstorm/ 2.开始安装 3.选择安装目录,点击下一步 4.勾选64位,点击下一步 5.继续下一步 ...