Jquery | CSS - 激活和去激活元素的卷軸上懸停

我有一個HTML是滾動的。
在HTML裏面我有一個也可以滾動的div。

當鼠標在該div中時，我不希望主HTML滾動處於活動狀態。它應該只在div內滾動。當它到達結尾時，它不應該再滾動該div，並且不應該激活身體滾動。

這裏有一個例子：

<html> 
    <body style="overflow:scroll;"> 
     <div id="SOME_ID">SCROLLABLE CONTENT HERE</div> 
    </body> 
</html>

我甚至不知道從哪裏開始。 CSS？ JQUERY？

任何幫助表示讚賞。

來源

2011-05-15 denislexic

這應該是常見的瀏覽器的默認行爲。 – Alp 2011-05-15 11:55:59

以下是完整的工作代碼.....

<html> 
    <head> 
    <style type="text/css"> 
    body 
    { 
     height:399px;//just for demo...you can specify whatever the height may be. 
     overflow:scroll; 
    } 
    #SOME_ID 
    { 
     border:1px solid black; 
     overflow:scroll; 
    } 
    </style> 
    <script src="http://code.jquery.com/jquery-latest.js"></script> 
    <script> 
    $(document).ready(function() 
    { 
    $("#SOME_ID").mouseover(function() 
    { 
    $("body").css('overflow','hidden'); 
    }); 
    $("#SOME_ID").mouseout(function() 
    { 
    $("body").css('overflow','scroll'); 
    }); 
    }); 
    </script> 
    </head> 
    <body> 
    <div id="SOME_ID">SCROLLABLE CONTENT HERE</div> 
    </body> 
    </html>

來源

2011-05-15 11:57:02 Anish

Jquery | CSS - 激活和去激活元素的卷軸上懸停

回答

相關問題