- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我尝试了多种方法来准确检测 mousewheel
/DOMMouseScroll
事件,但似乎不同浏览器的结果会有很大差异,尤其是硬件的差异到另一个硬件。 (例如:MacBook Magic Trackpad 会触发许多鼠标滚轮事件等)
JS 库已经多次尝试“规范化”mousewheel
事件的 wheelDelta
。但其中许多都失败了(我不再找到相关的SO问题,但有一些指出了这个失败)。
这就是为什么我现在尝试一个不mousewheel
事件的解决方案,而是onscroll
事件。 Here is an example使用滚动的隐藏容器 (#scroller
) 和具有正常内容的普通容器 (#fixed_container
) 进行滚动/鼠标滚轮检测。
由于#scroller
的高度有限(此处为4000px),我无法检测到滚动/鼠标滚轮无限...
如何允许无限滚动事件(通过为#scroller
设置无限高度?如何?)?
代码/Live demo :
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
body { overflow:hidden; }
#scroller { height: 4000px; }
#fixed_container { position:fixed; top:0px; left:0px; }
#text { position:absolute; top:100px; left:100px; }
</style>
<script type="text/javascript">
window.onscroll = function(e) {
console.log("scroll event detected! " + window.pageXOffset + " " + window.pageYOffset);
e.preventDefault();
return false;
}
</script>
</head>
<body>
<div id="scroller"></div>
<div id="fixed_container">
<div id="text">
Bonjour
</div>
</div>
</body>
</html>
最佳答案
“如何允许无限滚动事件”
这应该可以做到:
$(window).scroll(function() {
var st= $(window).scrollTop();
var wh= $(window).height();
var sh= $('#scroller').height();
if(sh < st+wh*2) {
$('#scroller').css({
height: st+wh*2
});
};
});
在 IE11、Firefox、Chrome、Opera 和 Safari 中进行了测试。
在下面的 fiddle 中,单击添加文本,以便您可以看到它滚动:
关于javascript - 使用 onscroll 检测鼠标滚轮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27325506/
我相信绝大多数小伙伴在自学python时,运用pycharm进行编写程序时发现字体太小不方便进行编写,通常像codeblocks这样的编程软件可以通过“ctrl+滚轮”进行放大和缩小。而
在我的应用程序中,我使用了 Scroller零件。我似乎无法弄清楚我应该在哪个事件上设置一个监听器以便知道何时滚动内容。我试过Event.CHANGE在 Scroller.verticalScroll
我正在使用一个简单的 progressDialog,它运行正常但轮子没有进步: //Progress Dialog final ProgressDialog dialo
我想在点击文本字段时关闭键盘,以便为该文本字段下方的选择器留出空间。 struct ContentView: View { @State private var date = Date()
我是一名优秀的程序员,十分优秀!