scrollTop和scrollHeight属性「建议收藏」

scrollTop和scrollHeight属性「建议收藏」———————————————————————检测滚动条是否滚动到底部:

大家好,又见面了,我是你们的朋友全栈君。

scrollTop和scrollHeight属性「建议收藏」

scrollTop和scrollHeight属性「建议收藏」

 ———————————————————————

检测滚动条是否滚动到底部:

scrollTop和scrollHeight属性「建议收藏」

<body>
		<div id="outerctn">
			<div id="innerctn">
				<div id="innerctn1">
					测试div1
				</div>
				<div id="innerctn2">
					测试div2
				</div>
			<div>
		</div>
	</body>
	<script type="text/javascript">
		var $outerctn=$('#outerctn');
		var innerctn=$('#innerctn');
		var scrollHeight=$outerctn.scrollHeight;
		var $outerctn_h=$outerctn.height();
		var innerctn_h=innerctn.height();
		
		var scrollTop=innerctn_h-$outerctn_h;
		$outerctn.on('scroll',function(){
			console.log($(this).scrollTop(),scrollTop)
			if($(this).scrollTop()>=scrollTop){
				console.log('滚动条到达底部了')
			}
		})
	</script>

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/163738.html原文链接:https://javaforall.net

(0)
上一篇 2022年7月24日 下午4:16
下一篇 2022年7月24日 下午4:36


相关推荐

  • 目前主流的app开发方式

    目前主流的app开发方式移动应用开发三种方式比较随着H5标准的发布以及推广,使得移动应用的开发也受到了很大影响,出于效率、成本等等的原因,移动应用的开发不在完全依赖于“原生”。今天就简单总结一下目前的三大主流移动应用开发类型。APP,一般认为是mobileapplication,也就是移动移动应用程序。1.NativeApp:本地应用程序(原生App)NativeApp是一种基于智能手…

    2022年5月30日
    38
  • linux防ddos 软件下载,linux系统防ddos攻击工具

    linux防ddos 软件下载,linux系统防ddos攻击工具DDoSdeflate其实非常简单,下面是详细的安装和配置步骤:1.安装DDoSdeflatewgethttp://www.inetbase.com/scripts/ddos/install.shchmod0700install.sh./install.sh//弹出版权信息后,在SSH下键入q,即可退出版权信息。2.配置DDoSdeflate.安装成功后会提示Config…

    2022年7月14日
    15
  • css设置横向滚动条样式_js设置滚动条样式

    css设置横向滚动条样式_js设置滚动条样式接上一篇,有的时候在项目里面会使用到滚动条但是浏览器默认的滚动条的样式不怎么好看这个时候需要进行一些处理一般用到两种1:隐藏滚动条,但是可以支持滚动的方法::-webkit-scrollbar{display:none}示例:https://www.jianshu.com/p/9efdb18d92a62:自定义滚动条样式.healthName::-we…

    2025年7月21日
    6
  • linux yum下载_虚拟机配置yum源

    linux yum下载_虚拟机配置yum源文章目录一.软件包管理1.RPM包管理2.源码包二.软件的安装工具1.YUM工具2.RPM工具一.软件包管理1.RPM包管理Red Hat Package Manager包的命名规则:软件名,版本号,发行版本,系统平台(32/64),后缀是.rpm**特点:**二进制包,无需编译,可以直接使用**缺点:**无法设定个人设置,开关功能2.源码包特点:需要经过gcc等编译环境编译才能运行,可以设定个人设置,开关功能缺点:配置复杂二.软件的安装工具1.YUM工具Yellow dog Upd

    2022年8月9日
    10
  • goland mac 激活码_在线激活

    (goland mac 激活码)好多小伙伴总是说激活码老是失效,太麻烦,关注/收藏全栈君太难教程,2021永久激活的方法等着你。IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/100143.htmlB1CUVFARG8-eyJsaWNlbnNlSWQi…

    2022年3月31日
    158
  • Maven系列(一):安装、配置Settings.xml配置文件与使用

    Maven系列(一):安装、配置Settings.xml配置文件与使用安装与使用今天博主将为大家分享一下 Maven 的下载与安装 不喜勿喷 如有异议欢迎讨论 以下所写内容均与以前的文章有联系可以前往博文查看 陈永佳的博客 Maven 前言首先 Maven 是基于项目对象模型 POMprojectob 可以通过一小段描述信息 配置 来管理项目的构建 报告和文档的软件项目管理工具 百度百科 这种又是大白话 如果没明白 maven 是什么

    2026年3月18日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号