Question

以下是该方案：

我有一个可滚动的HTML。
在HTML中我有一个也可滚动的div。

当鼠标位于该div中时，我不希望主HTML滚动处于活动状态。它只应在div内滚动。当它到达结尾时它不应该再滚动那个div并且身体滚动不应该激活。

以下是一个示例：

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

我甚至不知道从哪里开始。 CSS？ JQUERY？

任何帮助表示感谢。

Answer 1

这是完整的工作代码.....

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

Jquery | CSS - 在悬停时激活和取消激活元素的滚动

1 个答案: