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");           
});

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

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屋！