jQuery 窗口滚动事件没有启动 [英] jQuery window scroll event does not fire up

问题描述

我正在尝试通过 jquery 对 div 实现一个简单的留在视口内"行为.为此，我需要将一个函数绑定到窗口的滚动事件，但我似乎无法启动它:没有任何反应.我尝试了一个简单的 alert()，console.log() 没有骰子.知道我做错了什么吗?

I'm trying to implement a simple "stay inside the viewport" behaviour to a div via jquery. For that i need to bind a function to the scroll event of the window, but i can't seem to get it to fire up: nothing happens. I've tried a simple alert(), console.log() no dice. An idea what i'm doing wrong?

此代码:

$(window).scroll(function () {  
            console.log("scrolling");           
});

位于 script.js 中，位于我的 html 文件的最底部

sits in script.js, located at the very bottom of my html file

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>

更新测试网址:http://pixeline.eu/test/menu.php

推荐答案

您的 CSS 实际上将文档的其余部分设置为不显示溢出，因此文档本身不会滚动.最简单的解决方法是将事件绑定到正在滚动的事物上，在您的情况下是 div#page.

Your CSS is actually setting the rest of the document to not show overflow therefore the document itself isn't scrolling. The easiest fix for this is bind the event to the thing that is scrolling, which in your case is div#page.

改变就这么简单:

$(document).scroll(function() {  // OR  $(window).scroll(function() {
    didScroll = true;
});

到

$('div#page').scroll(function() {
    didScroll = true;
});

这篇关于jQuery 窗口滚动事件没有启动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！