关于使用JQ scrollTop方法进行滚动定位

没图我说个锤子,先来个自拍镇楼。

又到了每周周五总结时间。我广州刘德华又来讲故事了。这一周没啥任务,就一个任务,产品口头交代了两句,也没有psd没有设计图没有样式。自由发挥,你自己敲代码做个作品出来。

what?听到这个的时候我是一脸懵逼。我心里很慌,难道我资深射鸡湿和灵魂画家的身份暴露了?心里不禁感叹,唉,是金子哪里都会发光。

扯太远了,先来总结一下今天要写的东西吧。jquery的scrollTop方法这是啥子,那就先来一波自我介绍

1、scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置。

2、scroll top offset 指的是滚动条相对于其顶部的偏移。

如果该方法未设置参数,则返回以像素计的相对滚动条顶部的偏移。直接上例子吧

$(document).ready(function(){
  $("button1").click(function(){
    $("body").scrollTop(100);
  });
});

这个东西其实很常见,比如在浏览页面时,页面有5大块。那么你想直接从第一块跳转到第5块浏览,那么这个东西就可以用了,在scrollTop方法中设置一个参数,也就是选中元素距离页面顶部的距离。

上面的代码,当我们点击button1时,页面会往下移动100px;那换成div呢,其实是一样的。就是滚动条往下走100px。

还有就是在网页中有很多返回顶部按钮,通过这个方法也可以实现

$('body,html').animate({scrollTop:0},500),这里结合了animate()方法,另一种则是$(window).scrollTop(0)


更多专业前端知识,请上 【猿2048】www.mk2048.com

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/366024.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ssh密钥登录

方法一:使用下例中ssky-keygen和ssh-copy-id,仅需通过3个步骤的简单设置而无需输入密码就能登录远程Linux主机。 ssh-keygen 创建公钥和密钥。 ssh-copy-id 把本地主机的公钥复制到远程主机的authorized_keys文件上。ssh-copy-id 也会给远程主机的用户主目录&#x…

Spring REST:异常处理卷。 2

这是有关使用Spring进行REST异常处理的系列的第二篇文章。 在我以前的文章中,我描述了如何在REST服务中组织最简单的异常处理。 这次,我将更进一步,我将向您展示何时最好在ControllerAdvice级别上使用异常处理 。 介绍 在开始本文的技术部分…

python 装饰器有哪些_python装饰器有什么用

简言之,python装饰器就是用于拓展原来函数功能的一种函数,这个函数的特殊之处在于它的返回值也是一个函数,使用python装饰器的好处就是在不用更改原函数的代码前提下给函数增加新的功能。 一般而言,我们要想拓展原来函数代码&…

jQuery数据转换与提交

json2.js序列化,即JSON对象转换成String字符串: JSON.stringify({ id: 1, name: jsons });反序列化,即String转JSON对象: JSON.parse("{ id: 1, name: jsons }");jquery.json2xml.jsJSON对象转换为XML字符串: $.json2xml({ id: 1, …

linux中查看相关日志记录,linux重启查看日志及历史记录 查询原因

linux系统文件通常在/var/log中下面是对下面常出现的文件进行解释/var/log/message ---------------------------------------系统启动后的信息和错误日志/var/log/secure ------------------------------------------与安全相关的日志信息/var/log/maillog ------------------…

04,认证、权限、频率

认证组件 Django原生的authentic组件为我们的用户注册与登录提供了认证功能,十分的简介与强大。同样DRF也为我们提供了认证组件,一起来看看DRF里面的认证组件是怎么为我们工作的!models.py# 定义一个用户表和一个保存用户Token的表 class Use…

sun.misc.Unsafe和堆外内存

sun.misc.Unsafe类允许您执行许多Java中不应该做的事情,但是在非常特殊的情况下仍然有用。 必须在99%的时间避免这种情况,但是在极少数情况下,这是唯一有意义的解决方案。 这篇文章考虑了它在OpenHFT中的使用方式以及我希望在Jav…

jq获取input选取的文件名_tushare获取交易数据并可视化分析

获取数据是金融量化分析的第一步,找不到可靠、准确的数据,量化分析就无从谈起。随着信息技术的不断发展,数据获取渠道也越来越多,尤其是Python网络爬虫,近几年愈来愈火。然而,很多人毕竟精力有限&#xff0…

linux电脑做笔记软件,知识管理工具, 自由格式数据库, 笔记软件以及个人信息管理...

myBase Desktop 7.3.5 for Linux/MacOSX/Windows 2020-2-20新增 [数学公式 MathJax for Markdown]、[自动锁屏保护]、[粘贴图片为附件]、[完整复制带图片内容],以及部分问题修订,详见:更新日志;数学公式插件:缺省安装后…

js模板引擎

模板引擎 function tmpl(str, o) {return str.replace(/\\?\{([^{}] )\}/g, function (match, name) {return (o[name] undefined) ? : o[name];});}调用示例 var html tmpl(html, { user_id: user_id, user_name: user_name });更多专业前端知识,请上 【猿204…

原来游戏技术行业最大的秘密竟然是...

欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 本文由腾讯游戏云发表于云社区专栏 本篇文章主要是分享游戏业务面临的安全风险场景,以及基于这些场景的特点,我们应该如何做好对应的防护。 【一、背景:游戏行业DDoS攻击…

Leetcode 565. Array Nesting

题目 链接:https://leetcode.com/problems/array-nesting/ Level: Medium Discription: A zero-indexed array A of length N contains all integers from 0 to N-1. Find and return the longest length of set S, where S[i] {A[i], A[A[i]], A[A[A[i]]], ... }…

指定Gradle构建属性

属性是用于轻松自定义Gradle构建和Gradle环境的宝贵工具。 我将在本文中演示一些用于指定Gradle构建中使用的属性的方法。 Gradle支持项目属性和系统属性 。 这篇文章中有趣的是两者之间的主要区别是如何访问它们。 通过常规Java / Groovy系统属性访问方法访问系统属性时&…

python数字转中文字符_Python实现中文数字转换为阿拉伯数字的方法示例

本文实例讲述了Python实现中文数字转换为阿拉伯数字的方法。分享给大家供大家参考,具体如下: 一、需求 今天写了三千二百行代码。 今天写了3200行代码。 两行意思相同,只是表达方式不太能够,统一掉。 二、原理 数字的特征是 数字 …

调程序时的小错误

1.未能找到类型或命名空间名称“Form1”(是否缺少 using 指令或程序集引用?) 应该是复制代码的时候,把程序入口处的命名空间和Form1的命名空间不一致 2.检索 COM 类工厂中 CLSID 为 {XXXX-XXXX-XXX-XXXXX-XXX} 的组件时失败,原因是出现以下错误: 80040…

eclipse中设置Linux编码环境,更改eclipse中console编码

1.在eclipse.ini的-vmargs下面加上「-Dfile.encodingUTF-8」。2.eclipse-->Window-->Preferences-->General-->Workspace-->Text file encoding-->UTF-83.Installed JREs-->Default VM Arguments:-->-Dfile.encodingUTF-84.eclipse-->Run-->Run …

[记录] JavaScript 中的BOM操作

转载于:https://www.cnblogs.com/yuxi2018/p/9520059.html

GC对吞吐量和延迟的影响

每个Java应用程序都必须解决的一种类型的问题与垃圾回收有关。 当垃圾收集器工作时,它代表了一项奇妙的发明。 如果不是这样,或者GC做家务的方式变得不可预测,那么您就有一个朋友变成了敌人。 这篇文章是关于垃圾收集暂停时间的。 或更准确地…

linux odbc连接数据库失败,在Linux中使用RODBC连接到SQL Server时出错

我在linux服务器上运行不同的r程序。程序因数据库连接失败而出现以下错误: -1: In odbcDriverConnect(paste0("DRIVER{SQL Server}; server", server,: [RODBC] ERROR: state 08001, code 0, message[unixODBC][FreeTDS][SQL Server]Unable to connect to…

高级cmd攻击命令_一步一步学习DVWA渗透测试(Command Injection命令行注入)-第七次课...

各位小伙伴,今天我们继续学习Command Injection,翻译为中文就是命令行注入。是指通过提交恶意构造的参数破坏命令语句结构,从而达到执行恶意命令的目的。在OWASP TOP 10中一种存在注入漏洞,最常见的就是SQL和命令行注入。PHP开发的…