js滚动条滚动到底部和顶部
- <!DOCTYPE html>
- <html>
- <head>
- <title></title>
- <style type="text/css">
- .scrolldiv{
- width: 500px;
- height: 400px;
- margin: 1000px auto 100px auto;
- background: #f00;
- }
- </style>
- </head>
- <body>
- <div class="scrolldiv"></div>
- <script type="text/javascript">
- function scrollBottomOrTop(){
- var clients=window.innerHeight || document.documentElement.clientHeight||document.body.clientHeight;
- var scrollTop=document.body.scrollTop;
- var wholeHeight=document.body.scrollHeight;
- if(clients+scrollTop>=wholeHeight){
- alert('我到底部了');
- }
- if(scrollTop==0){
- alert('我到顶部了');
- }
- }
- window.onscroll=scrollBottomOrTop;
- </script>
- </body>
- </html>
js滚动条滚动到底部和顶部的更多相关文章
- js 滚动条滚动到底部触发事件
一.前言 在开发项目时,常常需要展示大量数据.如果全部显示出来,数据相对少时,看不出来什么不同,如果数据很多时,一次请求全部显示,这就相当可怕了. 面对这种问题,PC里使用了分页效果,将数据分成一页页 ...
- js滚动条滚动到底部触发事件
$("#contain").scroll(function(){ var $this =$(this), viewH =$(this).height(),//可见高度 conten ...
- 元素滚动到底部或顶部时阻止body滚动
移动端的弹窗内容有滚动条,滚动到底部或顶部时或影响弹窗下的body滚动,某些浏览器滚动到顶部时不松手就触发了刷新页面的情况,如果不需要这样的默认体验,就需要加一下判断了. var startX,sta ...
- android ListView滚动条监听判断滚动到底部还是顶部
代码: lv.setOnScrollListener(new OnScrollListener() { public void onScrollStateChanged(AbsListView vie ...
- jQuery 滚动条 滚动到底部（下拉到底部） 加载数据(触发事件、处理逻辑)、分页加载数据
1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...
- Android 控制ScrollView滚动到底部或顶部
在开发中,我们经常需要更新列表,并将列表拉倒最底部,比如发表微博,聊天界面等等, 这里有两种办法,第一种,使用scrollTo(): public static void scrollToBottom ...
- 关于div的滚动条滚动到底部，内容显示不全的问题。（已解决）
今天我做了一个带有滚动条,底部有两个按钮的div. 当我拖动滚动条到底部, 按钮没有显示出来. 我看了看我的样式设置,是这样的: /* 内容样式 */ #contentPartDiv{ posit ...
- asp.net---jquery--ajax 实现滚动条滚动到底部分页显示
前台:aspx页面 var bgtime = $(" #date1 ").val(); var overtime = $(" #date2 ").val(); ...
- 点击panel滚动条滚动到底部
$('#accordion').on('shown.bs.collapse', function () { var container = $(".admin-user .mx-scroll ...
- js滚动条滚动到某个元素位置
scrollTo(0,document.getElementById('xxx').offset().top);
随机推荐
- 续《基于C# 开发的SOL SERVER 操作数据库类（SQLHelp》 ——第二弹
续上一节,本节给出SQLHelp的具体实现方法--<YSFSQLHelp>,个人根据自己需要新建适合的类,本节根据参考网上资料,根据自己的需要编写的SQL帮助类.下面直接给出具体实现: / ...
- 西门子S7系列转以太网通讯处理器类型分析
捷米特以太网通讯处理器用于西门子S7-200/SMART /S7-200/S7-300/S7-400/西门子数控840D.840DSL等PLC的以太网数据采集,支持工控领域内绝大多数SCADA软件,支 ...
- flutter小白是如何在一周内用chatGPT开发一款App的
创作初衷 这篇文章创作的初衷,只是为了写一个有关日历类的软件供自己使用,考虑到自己从来还没有使用flutter正式创作一个app,因此磨刀霍霍想试一试. 至于为什么要做一款日历软件,因为发现市面上的关 ...
- Federated Learning004
联邦学习--笔记004 2023.03.13周一 快中期答辩了(3.20),最近甲流高发期 毕设期间,今天学习了联邦学习的一篇论文---Differentially Private Federated ...
- PHP echo 和 print 语句
在 PHP 中,有两种基本的输出方法:echo 和 print. PHP echo 和 print 语句 echo 和 print 之间的差异: echo - 能够输出一个以上的字符串 print - ...
- 小程序软键盘&SM2解密方式
小程序软键盘&SM2解密方式 转载请著名出处:https://www.cnblogs.com/funnyzpc/p/17572445.html SM2基本信息 私钥(primary key) ...
- 懒人的百宝箱「GitHub 热点速览」
本周 GitHub Trending 除了 lazydocker 之外,还有多个 lazy 项目上线,比如大家熟悉的 lazyvim,可见,这个世界对懒人还是很友好的.除此之外,主打一个密码免输入,绕 ...
- Nextcloud登录界面输入用户名和密码后报内部故障
查询~/nextcloud/data/nextcloud.log,找到日志报出如下错误 "Something is wrong with your openssl setup: error: ...
- Swiper.vue?56a2:132 Uncaught DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.
错误代码 解决方案 删除div标签.修改后,如下所示:
- 是时候丢掉BeanUtils了
前言 为了更好的进行开发和维护,我们都会对程序进行分层设计,例如常见的三层,四层,每层各司其职,相互配合.也随着分层,出现了VO,BO,PO,DTO,每层都会处理自己的数据对象,然后向上传递,这就避免 ...