如果div固定，則顯示全部內容

Question

在這里，我有兩個long div 。 第一個div是固定的，我想在用戶滾動時顯示div.content所有元素（因為我在第一個div上有完整的元素。我該怎么做？

<div style="display: block; width: 100%;">

    <div style="float: left; position: relative; z-index: 0;">
        <div style="position: relative;">
            <div class="content" style="padding-top: 10px; top: 10px; position: fixed;">

                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                <div style="margin-top: 10px;">MENU</div>
                 Show element after user scrolls
            </div>
        </div>
    </div>

    <div style="float: left; margin-left: 11%; width: 67%;">

        Right DIV FUll LONG TEXT

    </div>

</div>

Answer 1

只需檢查一下。 我認為只是在固定內容塊中，您必須增加一些高度，然后進行溢出滾動。

 <div style="display: block; width: 100%;"> <div style="float: left; position: relative; z-index: 0;"> <div style="position: relative;"> <div class="content" style="padding-top: 10px; top: 10px; position: fixed;overflow-y: scroll;height: 186px;"> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> <div style="margin-top: 10px;">MENU</div> Show element after user scrolls </div> </div> </div> <div style="float: left; margin-left: 11%; width: 67%;"> Right DIV FUll LONG TEXT </div>