javascript - スクロールバーをオンにしない要素を作成できますか?

Question

部分的に画面に表示されるフローティング パネルがあります。スクロールバーを表示する必要があるかどうかを決定するときに、ウィンドウ/ボディはそれを無視できますか?

他の要素がウィンドウの外に出るときはスクロールバーが必要ですが、このパネルは必要ありません。したがって、本体の overflow:hidden は機能しません。

Answer 1

動作を示すために例を挙げました。しかし、私はあなたのレイアウトについての手がかりがありません。

HTML

<div>
    <div class="pnlContent left"><!-- put as much content as you want here it will put a scroll bar on the body as the content opverflows --> 
        <p>
        Why use Modernizr?
Taking advantage of cool new web technologies is great fun, until you have to support browsers that lag behind. Modernizr 

makes it easy for you to write conditional JavaScript and CSS to handle each situation, whether a browser supports a 

feature or not. It’s perfect for doing progressive enhancement easily.

How it works
Modernizr runs quickly on page load to detect features; it then creates a JavaScript object with the results, and adds 

classes to the html element for you to key your CSS on. Modernizr supports dozens of tests, and optionally includes 

YepNope.js for conditional loading of external .js and .css resources.

            Check out the full list of features that Modernizr detects, or learn more about conditional resource loading 

with Modernizr.</P>
 </div>
 <div class="pnlWrapperNoOf right"> <!-- put as much content as you want here it will just be hidden --> 
        <div class="panel">
            <p>We have floating panels that may be partially in screen. Can the window/body ignore it when it decides if 

scroll bar needs to show?

                We do need scroll bar when other elements go outside of the window, but not this panel. So overflow:hidden 

on the body won't work.</p>
               <p>We have floating panels that may be partially in screen. Can the window/body ignore it when it decides if 

scroll bar needs to show?

                We do need scroll bar when other elements go outside of the window, but not this panel. So overflow:hidden 

on the body won't work.</p>
        </div>
    </div
</div>

CSS

div
{
    border:1px solid #cecece;
}
div.pnlWrapperNoOf
{
    max-height:300px;
    overflow:hidden;
}
div.left
{
    float:left;
    width:49%;
}
div.right
{
    float:right;
    width:49%;
}

Answer 2

ビューポートを基準にして配置されたオブジェクトposition: fixedは、スクロールに影響しません。