关于css position和scroll事件的一些理解

　　昨天在做拾色器开发的时候，由于要将失色器定位到一个弹出框中。所以我使用了position:absolute属性。获取点击元素的位置。我获取它的位置的方法是使用$(this).offset().left，$(this).offset().top。因为absoulte是相对页面进行定位的。所以我在弹出框内的滚动条滚动的时候它不会跟着滚动。当时我想到的解决办法就是使用一个方法来获取scroll是向上滚动还是向下滚动。

　　使用的办法就是使用$("div").scroll()。获取它的scrollTop的值和上一次滚动的值进行比较来比较大小，从而判断是向上还是向下滚动。

不过我后来想到更方便的解决方法，就是不使用absolute定位。直接将元素插入到最底层，然后使用margin-left和margin-right来进行定位。个人感觉这个是最好的办法。

转载于:https://www.cnblogs.com/zzcflying/archive/2012/07/18/2596780.html

关于css position和scroll事件的一些理解相关推荐

jQuery scroll事件
前言 jquery 3.5.1 scroll事件 <html> <header> <script crossorigin="anonymous" in ...
html页面滚动条监听事件,滚动条的scroll事件
在vb中,滚动条的scroll 事件和change 事件的区别scroll和change的区别为:指代不同.用法不同.侧重点不同一.指代不同 scroll:滚屏,滚动. change:变更,变革. ...
scroll事件详解
以前眼高手低,不够扎实,面试的时候总是处理过,却想不出来细节,这次开始慢慢整理,蜗牛继续爬坡 CSS 一般情况下,如果出现内容大于浏览器的时候,需要添加样式 overflow:scroll 关于sc ...
css左边定位,CSS Position(定位) | 菜鸟教程
CSS Position(定位) position 属性指定了元素的定位类型. position 属性的五个值: 元素可以使用的顶部,底部,左侧和右侧属性定位.然而,这些属性无法工作,除非是先设定po ...
php滚动加载分页,jQuery scroll事件实现监控滚动条分页实例详解
这篇文章主要介绍了jQuery scroll事件实现监控滚动条分页简单示例,使用ajax加载,同时介绍了(document).height()与$(window).height()的区别,需要的朋友可 ...
scroll事件实现监控滚动条并分页显示示例（zepto.js）
scroll事件实现监控滚动条并分页显示示例(zepto.js ) 需求:在APP落地页上的底部位置显示此前其他用户的购买记录,要求此div盒子只显示3条半,但一页有10条,div内的滑动条滑到一页 ...
CSS中overflow:scroll怎么设置只上下滚动而不左右滚动
CSS中"overflow:scroll"默认是左右,上下都滚动.怎么设置只上下滚动而不左右滚动,下面有个不错的解决方法 CSS中"overflow:scroll&quo ...
CSS position绝对定位absolute relative
常常使用position用于层的绝对定位,比如我们让一个层位于一个层内具体什么位置,为即可使用position:absolute和position:relative实现. 一.position语法与结 ...
教你玩转CSS Position(定位)
目录 CSS Position(定位) static 定位 fixed 定位 relative 定位 absolute 定位 sticky 定位重叠的元素所有的CSS定位属性

关于css position和scroll事件的一些理解

关于css position和scroll事件的一些理解相关推荐

最新文章

热门文章