请问怎么控制弹出框滚动条滚动到头部和底部时,不触发body的滚动事件。在遮罩层上可以滚动body

body内容较多,带有滚动条。弹出层为一个遮罩和一个div div上也有滚动条。如何控制在div上滚动到顶部和底部body不跟着滚动,在遮罩层上可以滚动body

3个回答

使用mousewheel事件,禁止鼠标滚轮滚动,然后用js控制div的滚动
javascript鼠标滚轮滚动事件
如何自定义鼠标滚动时窗口滚动距离

有没有大神 指导一下思想

出遮罩层的时候把body的冒泡事件禁掉

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
元素滚动到底部或顶部时阻止body滚动
移动端的弹窗内容有滚动条,滚动到底部或顶部时或影响弹窗下的body滚动,某些浏览器滚动到顶部时不松手就触发了刷新页面的情况,如果不需要这样的默认体验,就需要加一下判断了。 var startX,startY,endX,endY,distanceX,distanceY;//判断容器的滑动方向 //判断元素滑到底部时阻止滑动body,使用时传入局部滚动的选择器即可 ...
jq 当div的滚动条滚动到底部时,body的滚动条不滚动
var $top,$top2,$a; $(".video_menu").mouseenter(function(){ $a=1; $top=$("html").scrollTop(); }).mouseleave(function(){ $a=2; }); $(document).s
body的滚动事件的坑
监听body的滚动事件遇到的坑
判断滚动滚动到底部
$(function(){ $('#aa').on('scroll', function(){ var 容器固定高度 = $('#aa').height(); var 文档高度 = $('#aa').scrollHeight; var 滚动条位置 = $('#aa').scrollTop(); if(文档高度 == 容器固定高度 + 滚动条位置){ alert('我到底部了'); }
弹窗的滚动条不影响 body的滚动
// 弹窗的滚动条不影响 body的滚动 $('.btn-actsm').click(function(){ $('body').addClass('pon'); }); $('.btn-close').click(function(){ $('body').removeClass('pon'); }); 注: .btn-actsm :点击出现弹窗的按钮; .btn-cl...
请教高手:body滚动条,滚动到底部时触发什么事件
请教高手:body滚动条,滚动到底部时触发什么事件,rn我想在它滚动到底部时去搜索数据库,不知用javascript的哪个事件?
移动端弹出层滚动时禁止body滚动
移动端弹出层滚动时禁止body滚动 相信很多写移动端的朋友会遇到这个问题,我也遇到了,之后就辛辛苦苦的在网上找解决办法,下面我大概提一下我在网站遇到的几种办法,行不行的通呢?本人就亲测了下。如果有什么不对的地方或者有好的解决办法,也请告知。 1.弹出层出现时给body添加一个css样式:height:100%;overflow:hidden;弹出层消失再去掉这个类。 测试结果:chrome手
手机页面上body不随遮罩层上内容一起滚动
先定义css.alpha { height: 100%; overflow: hidden; position: relative; }.alpha body { height: 100%; overflow: hidden; }然后再弹出或隐藏遮罩层的时候,用js$('html').toggleClass('alpha');
js滚动条滚动到底部触发分页
三个值(滚动视窗高度 + 当前已滚距离 >= 滚动内容总高度) 1.获取滚动视窗高度:$(window).height();(如果滚动区域不是整个页面,使用$('slector').height()) 2.当前已滚距离:$(this).scrollTop(); 3.获取滚动内容总高度:$(this).get(0).scrollHeight;   $('#members-scroll...
body背景固定或随滚动条滚动
  body背景写法: BACKGROUND: url(v_0328_01.gif) #F8FCFB fixed repeat-x;   注意加了fixed之后,滚动条滚动时,背景不动,如果不加fixed,背景随滚动条一块移动。   固定背景图片的另一种方法:   background: url(v_0328_01.gif) repeat-x #F8FCFB; backgroun...
body的onload事件怎么触发
我在onload事件中通过JavaScript脚本往select下拉框中添加一些内容, rn但asp控件如button的click刷新页面后,select下拉框中没东西了, rn是不是这时不会触发body的onload事件?这样的话该怎么做能保证select下拉框中有内容?,
vue弹窗滚动body跟随滚动问题
找了一些办法,具体可行并且比较简单的方法如下 <el-dialog @open=“toggleBody(1)” @close=“toggleBody(0)”> //表格内容 methods:{ // 打开弹窗,body不可滚动 toggleBody(isPin) { if (isPin) { document.body.style.height = ‘100vh’ document....
滚动数据窗的滚动条时触发什么事件?
-
jquery 滚动条滚动到底部
菜鸟教程-prop 菜鸟教程animate $("#chartContainer").animate({scrollTop:$("#chartContainer").prop("scrollHeight")}, 400);//0.4秒内滚到底部  
滚动条滚动到底部,加载更多
基因分析{$web_setting.web_name ? ' '.$web_setting.web_name : ''}{$web_setting.web_title ? ' '.$web_setting.web_title : ''} {include file="header"} <div class="...
弹出框随滚动条滚动
窗口随滚动条滚动效果
移动端如何禁止body的滚动
移动端如何禁止body的滚动1、js原生方法:document.addEventListener('touchmove', function(event) { event.preventDefault(); }, false);或者function stopScroll(e){ document.documentElement.style.overflow='hidden'; }2、jQuery/Z
图片在body中来回滚动
效果如图: JS代码var oScroll=document.getElementById('scroll'); var right=0; setInterval(function(){ if(right==0){ oScroll.style.left=oScroll.offsetLeft+2+'px'; if(oScroll.offsetLeft>=d
手机弹窗 禁止body滚动
h5手机页面弹窗,弹窗内滑动,禁止body滚动。h5手机页面弹窗,弹窗内滑动,禁止body滚动
移动端遮罩层滚动时,禁止底部滑动
参考文章 关键css: body.modal-open { position: fixed; width: 100%; } 关键js: // 解决移动端弹出层滚动穿透问题 var ModalHelper = (function(bodyCls) { var scrollTop; return { afterOpen: function() {...
弹出遮罩层,body不滚动,点击遮罩层非内容区域关闭遮罩层
一 .弹出遮罩层时,控制页面不再滚动,需要给body设置position:fixed;height:100%;overflow-y:hidden;关闭遮罩层后,去掉上述属性即可。二 .另外,手机端还可以通过禁止移动端触屏滑动来解决弹出遮罩层,阻止页面滑动的问题$('body').bind("touchmove",function(e){e.preventDefault();});关闭遮罩层后,解除...
ion-scroll滚动到底部事件
部分代码块           device-width on-scroll="onScroll()">                                                                                                                      image-preview="{
滚动条循环,判断滚动条滚动到底部
scrollTop为滚动条在Y轴上的滚动距离。 clientHeight为内容可视区域的高度。 scrollHeight为内容可视区域的高度加上溢出(滚动)的距离。 滚动条到底部的条件即为scrollTop + clientHeight == scrollHeight。上面的公式很重要
body 滚动条
怎么不显示,还要符合标准
滚动到边缘触发事件
征服微信小程序视频教程n微信小程序是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。学员通过该视频课程,可以完全了解小程序的开发方法,并可以独立开发完整的小程序。
如何触发listview滚动条滚动事件!!!
rn 我需要触发listview滚动条滚动的事件,即每次点滚动条后需要触发该事件,我该如何处理? rn
如何获得触发Listview滚动条滚动的事件?
如题rn另有一个要求:不能使用Timer
react判断滚动到底部以及保持原来的滚动位置
这里解决两个问题: * 判断某个组件是否滚动到底部 * 页面切换出去再切换回来后怎样保持之前的滚动位置 要保证这个组件就是那个滚动的组件,overflowY为scroll 判断某个组件是否滚动到底部 组件代码如下,通过ref获取真实的dom节点 <div ref={ node => this.contentNode = node }> 在组件加载完成后增加监听scroll事件,组件将要卸
我的滚动条怎么不滚动?!
我参照侯俊杰《深入浅出MFC》(第二版)476页“可滚动的窗口:CScrollView”一节,以四个步骤修改我的程序如下:rn一.定义Document的大小。我把它设为我屏幕大小的两倍。rn二.将我自定义的View类的父类由CView改为CScrollView,并准备改写其虚函数 OnInitialUpdate()。rn三.改写OnInitialUpdate,在其中设定滚动条范围。rn四.修改鼠标坐标。rn当我做完上面四个步骤后,将程序编译连接。运行后发现程序确实有了滚动条,但是当我用鼠标下拉滑块,电击箭头,或者点击滚动条,都不能使其滚动。拖拽滑块时,滑块倒是跟着鼠标移动,但是View的内容没变。当鼠标放开时,滑块立刻恢复到原来位置。rn请问,这是怎么回事?!rn
有关滚动触发事件
滚动一定的距离则使某个元素显示,反之则隐藏?
网页滚动条滚动事件
今天在写代码的时候碰到了滚动条事件,这里记录一下,以防忘记 一、整个网页滚动事件 直接贴代码 $(window).scroll(function () { if ($(document).scrollTop() + $(window).height() >= $(document).height()) { page++;
javascript滚动条滚动到div的最底部
直接上代码 //box-container是添加overflow的父div,也就是出现滚动条的div var scrollTarget = document.getElementById("box-container"); //scrollTarget.scrollHeight是获取dom元素的高度,然后设置scrollTop scrollTarget.scrollTop=scrollTar...
element的el-scrollbar 滚动条滚动到底部加载数据
公司要求前后端分离,springboot+vue 实现前后端分离,使用前端UI框架element,可怜我只能从后端做前端的活了。其中某个页面的表格用两种形式展现:表格和列表。其中表格用的是element专门的控件(el-table),列表形式就是自己组合的了,这时领导要求列表形式要通过滚动条来加载数据(具体可参考手机下拉刷新功能)。 言归正传,现在来实现相应的功能,主组件App.vue页面的代码...
duilib 滚动条滚动到底部,加载数据
让滚动条滚到底部,加载数据修改代码 int CScrollBarUI::GetScrollPos() const { int nRange = GetScrollRange(); if( nRange == m_nScrollPos ) { //  } return m_nScrollPos; }
滚动条不能滚动到底部问题
android listview中有imageloaderrn当imageloader中的图片加载出来时:图片不能滚动到底部,大家有没有什么好的办法rn我lvIMDetail.setSelection(listData.size() - 1); 是这样设置滚动到底部的rn有没有设置滚动条在底部的rn
JavaScript滚动到底部触发加载数据
滚动到底部触发事件 $(window).on("resize scroll",function(){ var $currentWindow = $(window);               var windowHeight = $currentWindow.height();//当前窗口的高度               var scrollTop = $currentWindow
滚动条向下滚动事件
var pageCount = ${pageCount}; var page = 1; var keyword = '${keyword}'; var is_continue = true; function is_need_scroll(){ if(is_continue){ return jQuery(document).scrol...
e.client事件与滚动条滚动
当滚动条滚动时,e.clientX的位置没有跟着改变,怎么样才能让它的值跟着增加及减少
监听滚动条的滚动事件
当滚动条滚动时,会触发onscroll事件。 如果用jQuery设置监听,可以写成 $(selector).scroll(function(event){     ...... })   给显示滚动条的元素的scrollTop属性赋值,则指定滚动条滚动到哪里。单位是px。   将元素css的overflow属性设置成overflow:hidden时,表示隐藏滚动条,滚动条实际上...
js监听滚动条滚动到底部
$(document).ready(function () { window.addEventListener(&quot;scroll&quot;,function(e){ if (($(document).scrollTop()) &amp;gt;= ($(document).height() - $(window).height())) { //当底部基本距离+滚动的高...
相关热词 c# stream 复制 android c# c#监测窗口句柄 c# md5 引用 c# 判断tabtip 自己写个浏览器程序c# c# 字符串变成整数数组 c#语言编程写出一个方法 c# 转盘抽奖 c#选中treeview