使用jQuery,使用浏览器滚动条滚动div内容而不滚动页面...

时间:2011-09-13 22:02:12

标签: jquery scrollbar

我的标题区域高度为575像素。我想在用户移动滚动条或使用鼠标滚轮时滚动此标题div的内容,但当滚动条到达该内容的结尾时,我需要整个窗口开始像平常一样滚动。

真正基本的示例代码:

<div id="header">

    <div id="text1">ONE</div>
    <div id="text2">TWO</div>
    <div id="text3">THREE</div>
    <div id="text4">FOUR</div>

</div>

<div id="main-content"></div>

我在这里设置了JSfiddle:http://jsfiddle.net/3uefZ/5/

标题div上有滚动条 - 这是我不想要的:(但这是唯一可以接近可视化我的意思的方式。

我喜欢这方面的任何帮助......

谢谢!

1 个答案:

答案 0 :(得分:0)

这可能有效:

http://jsfiddle.net/BbGdM/

var i = document.body.scrollTop;
var scrolling = true;
window.onscroll = function(){
    if(scrolling) {
        var old = document.getElementById("header").scrollTop
        document.getElementById("header").scrollTop += document.body.scrollTop;
        if( document.getElementById("header").scrollTop == old &&
            document.body.scrollTop > 0) {
            scrolling = false;
        }
        document.body.scrollTop = 0;
    }
}
但是,相当迟钝......我希望这不是一种新的广告......