开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >专栏 >js检测滚动条到底部

js检测滚动条到底部

作者头像

仙士可

发布于 2019-12-17 09:36:49

发布于 2019-12-17 09:36:49

9.4K00

代码可运行

举报

文章被收录于专栏：仙士可博客仙士可博客

运行总次数：0

代码可运行

$('#content-zone').scroll(function(){
    if (this.scrollTop+$(this).height()+4>this.scrollHeight){
        var  page = parseInt($('#page').val());
        var  page_num = parseInt($('#page_num').val());
        if(page<page_num){
            get_message(page+1);
        }
    }
});

//第二行的+4是padding和magin的距离

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2017/05/02 ，如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

评论

登录后参与评论

暂无评论

编辑精选文章

换一批

鹅厂写码13年，我总结的程序员高效阅读方法论

进程，线程，协程 - 你了解多少？

微服务与分布式系统设计看这篇就够了！

腾讯文档表格卡顿指标探索之路

从Hadoop1.0到Hadoop2.0架构的优化和发展探索详解

微服务架构：由浅入深带你了解底层注册中心

2023腾讯·技术创作特训营第三期

JavaScript中的盒子模型通常指的是HTML元素在页面中的表示和排列方式，由浏览器处理和管理。盒子模型描述了一个元素在页面布局中所占据的空间，包括元素的内容（content）、内边距（padding）、边框（border）和外边距（margin）。

星辰大海c

2023/11/20

2030

移动端滚动分页解决方案

腾讯技术创作特训营S11#重启人生分页事件数据移动端

目前主流的解决方案主要有两个，scroll 和 IntersectionObserver

万少

2025/02/10

670

文本框根据输入内容自适应高度

jQuery实现 (function($){ $.fn.autoTextarea = function(options) { var defaults={ maxHeight:null,//文本框是否自动撑高，默认：null，不自动撑高；如果自动撑高必须输入数值，该值作为文本框自动撑高的最大高度 minHeight:$(this).height() //默认最小高度，也就是文本框最初的高度，当内容高度小于这个高度的时候，文本以这个高度显示 }; var opts = $.exten

lilugirl

2019/05/28

1.1K0

滚动条判断是否滑动到顶部底部

/** * [滚动条] */ $(window).scroll(function() { var scrollTop = $(this).scrollTop(); // 滚动条距离顶部的高度 console.log("滚动条距离顶部的高度-->" + scrollTop); var scrollHeight = $(document).height(); // 当前页面的总高度 console.log("

ProsperLee

2018/10/24

2.8K0

Div Scroll Bar (用层模拟滚动条)

对Div的盒模型以及Css控制定位都不熟，所以遇到了不少BT问题……好在最终突破了种种困难，基本实现了自己想要的效果。说明: 最大的突破是通过了 xhtml1-transitional.dtd 验证，可以在xhtml文档里正常使用. 采用相对定位，使用起来更灵活，可以放在页面任何地方而不用改程序. 结构规范，容易扩展. 代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR

张善友

2018/01/19

1.4K0

WordPress集成底部滚动推荐条，让好文章不再被埋没

最新消息：目前该功能张戈博客已推出 WordPress 插件，欢迎安装使用！详细介绍=>> 这个功能最开始叫底部滚动公告条，部分 WordPress 主题集成自带，比如知更鸟主题。主题没集成的还可以使用万戈牌公告栏插件来实现这个功能。不过以往插件或主题集成的公告栏功能都只会滚动公告，即后台会有一个公告撰写栏，可以编辑数条公告然后在前台底部滚动显示。最开始，张戈博客也是用了知更鸟主题特有的公告功能来发布一些公告，后来在我折腾中国博客联盟展示导航的时候，发现原来要实现滚动其他内容也是非常简单的！因此，我就将

张戈

2018/03/23

1.5K0

滚动条滑动到指定位置

1，由于位置是我们指定，所以需要用一个input输入，因此允许的输入值范围提示，输入框，触发事件按钮采用的是浮窗，漂浮在最顶部，类似一个导航。

Rattenking

2021/01/29

3.2K0

vue自定义底部居中固定栏

container default require scrolltop 事件

leader755

2023/07/31

8360

svelte3.x模拟滚动条组件SvelteScrollbar

前几天有给大家分享一个svelte.js自定义网页版弹窗组件svelte-layer。今天再来分享一个最新基于svelte.js开发的网页虚拟美化滚动条组件svelte-scrollbar。

andy2018

2022/05/09

1.8K0

VScroll：基于Vue美化滚动条组件|vue.js自定义滚动条

vue.js typescript

VScroll 一款基于vue2.x构建的虚拟替代系统原生滚动条组件。支持自定义是否原生滚动条、自动隐藏、滚动条大小及颜色等功能。拥有完美顺滑的滚动体验！

andy2018

2020/12/01

20K1

VScroll：基于Vue美化滚动条组件|vue.js自定义滚动条

Vue注册自定义指令实现element-ui组件库select下拉框滚动加载更多

vue.js javascript

在项目开发过程中，总会遇到这样或者那样的问题，这次，用element-ui组件库的select，但是这个组件不支持分页加载更多，如果一次性把所有的数据都返回给前端，那还需要后端再加个接口。是不是有其他方式可以扩展下select？

青年码农

2022/04/12

2.4K1

Vue注册自定义指令实现element-ui组件库select下拉框滚动加载更多

JS滚动条触底加载更多

https 网络安全 api 网站 android

https://codepen.io/klren0312/full/dybgayL

治电小白菜

2020/08/25

8.7K0

如何在DataGrid里面产生滚动条而不滚动题头

asp.net 数据库

我们在开发的时候一定遇到，使用DataGrid的时候由于不想分页（数据没有那么多）但是又显示不在一页里面，此时我们希望在DataGrid里面出现一个滚动条，可以上下滚动DataGrid里面的数据而不用上下滚动页面，由于写本文的目的是为了说明如何实现，所以对于细节性的问题读者可以自己思考完成（比如：既要分页又要滚动等等）。为了可以滚动DataGrid我们需要一个可以让客户端的Table滚动js脚本（该js代码我是从CodeProject上面下载的），但又不能滚动Table的题头（也就是第一行）。我们都知道Da

阿新

2018/04/13

1.6K0

java https 网络安全

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/101129.html原文链接：https://javaforall.cn

全栈程序员站长

2022/06/30

6550

html 滚动条 scrolltop scrollheight,浅谈JavaScript中scrollTop、scrollHeight、offsetTop、offsetHeight…

node.js javascript css

浅谈JavaScript中scrollTop、scrollHeight、offsetTop、offsetHeight

全栈程序员站长

2022/09/15

2.3K0

html 滚动条 scrolltop scrollheight,浅谈JavaScript中scrollTop、scrollHeight、offsetTop、offsetHeight…

干货丨JS 经典实例收集整理

编程算法 node.js

一、跨浏览器事件跨浏览器添加事件 //跨浏览器添加事件 function addEvent(obj,type,fn){ if(obj.addEventListener){ obj.addEventListener(type,fn,false); }else if(obj.attachEvent){//IE obj.attchEvent('on'+type,fn); } } 跨浏览器移除事件 //跨浏览器移除

腾讯NEXT学位

2020/05/12

1.5K0

JS - 兼容到ie7的自定义样式的滚动条封装

demo： html： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="author"

xing.org1^

2018/10/10

5.1K1

JS - 兼容到ie7的自定义样式的滚动条封装

vue.js中滚动条加载更多数据

vue.js html https

本文章参考：http://www.cnblogs.com/ssrsblogs/p/6108423.html

lin_zone

2018/08/15

5K0

vue.js中滚动条加载更多数据

python自动化之JS处理滚动条

linux selenium javascript

滚动条操作浏览器滚动条并没有提供相应的操作方法。在这种情况下，就可以借助JavaScript也就是JS来控制浏览器的滚动条。 WebDriver提供了execute_script()方法来执行JavaScript代码。 js="window.scrollTo(100,450);" driver.execute_script(js) 当页面上的元素超过一屏后，想操作屏幕下方的元素，是不能直接定位到，会报元素不可见的。这时候需要借助滚动条来拖动屏幕，使被操作的元素显示在当前的屏幕上。滚动条是无法直接用定位工具来定位的。selenium里面也没有直接的方法去控制滚动条，这时候只能借助JS了，还好selenium提供了一个操作js的方法: execute_script()，可以直接执行js的脚本。 --scrollHeight 获取对象的滚动高度。 --scrollLeft 设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离。 --scrollTop 设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离。 --scrollWidth 获取对象的滚动宽度。

Python研究者

2020/09/28

5.1K0

↓↓↓ HTML如何局部滚动而头尾不滚动 ↓↓↓

html javascript

兼容 android（4.3版本三星 note2）进行嵌套，没有引用任何插件，纯css。

White feathe

2021/12/08

3K0

相关推荐

JS盒子模型

更多 >

本文部分代码块支持一键运行，欢迎体验

本文部分代码块支持一键运行，欢迎体验