使用jQuery，使用瀏覽器滾動條滾動div的內容而不滾動頁面...

Question

我有一個575px高的標題區域。當用戶移動滾動條或使用鼠標滾輪時，我想讓這個頭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滾動條 - 我不想:(但它是唯一的方法可以得到接近可視化我的意思。

我很想有這方面的幫助...

謝謝！

Answer 1

這可能工作：

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

相當的hackish，但...我所以希望這不是廣告的新品種......