堆栈内存溢出
  简体   繁体   English

如果div固定，则显示全部内容

[英]Show full content if div is fixed

 原文  2016-09-25 11:27:43  6   1    javascript/ jquery/ html/ css

问题描述

Here i have two long div s. 在这里，我有两个long div 。 The first div is fixed, and I want to show all elements of div.content when user scrolls (because I have full elements on first div . How can i do this? 第一个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>

1 个解决方案

解决方案1
 1  2016-09-25 11:50:16

Just check this out. 只需检查一下。 I think just in you fixed content block you have to add some height then give overflow scroll. 我认为只是在固定内容块中，您必须增加一些高度，然后进行溢出滚动。 

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

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 最初固定完整背景图像，然后在DIV内容结束时滚动 - Full background image initially fixed, then scrolls when DIV content ends 全高div固定 - Full height div to fixed 位置固定的叠加层无法显示div中的所有内容 - Overlay with position fixed does not show all content inside div 展开div的其余部分以显示全部内容（带有按钮的onClick） - Expand rest of the div to show the full content (onClick with buttons) 限制DIV中的固定内容 - Constrain Fixed Content Within a DIV 固定div与滚动内的内容 - fixed div with content inside scrolling 扩展具有固定高度的内容div - Expanding content div with fixed height 显示/隐藏具有固定位置的div - Show/hide div with fixed position 全屏固定div内的居中图像 - Centering image inside a full screen fixed div 固定位置全高div滚动问题 - Fixed position full height div scrolling issue
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM