左列滚动,其他选项则滚动条?(Left column scrolling, other option

2019-10-30 07:22发布

我有一个关于通过HTML / CSS内容易滚动的问题。 这是我有:

在左边的列我有我的数据。 在右列中我加载当您单击左侧列中的链接上的iframe中。 是否有人知道我可以很容易地滚动,但我的右IFRAME停留在那个位置?

这是我的html代码:(我用的自举)

<div class="row">
      <div class="span6">
            <div class="row" id="errors">
                 <div class="span6>
                 </div>
                 <div class="span6>
                 </div>
                 ....
            </div>
       </div>
       <div class="span6">
            <div id="side-content">
                <iframe id="iframe" src="" scrolling="no" frameborder="0"></iframe>
            </div>
       </div>
</div>

Answer 1:

你可以尝试像下面这样。

$win = $(window);
    $win.on('scroll', function() {
        $("#side-content").css({"position":"absolute", "top":"0"}, $win.scrollTop() > 1);
    });

这背后的想法是一样的粘稠的标题菜单当用户滚动超过某个点。 因为你总是希望它呆在那里,如果用户滚动超过1个像素就会回到顶部:0,所以它几乎是不为用户。

如果你尝试,不想它,你也可能只是使用

#side-content { position: fixed; top: 0; }

但如果你的#滑盖内容高度比窗口更大的显然是行不通的



Answer 2:

尝试设置iFrame的高度相同的高度左侧的列。 在需要的时候再进行溢出滚动。 如果你知道iFrame的高度这是可行的。

#errors{
    height:400px;
    overflow-y:auto;
}
#side-content{
   height:400px;
}


文章来源: Left column scrolling, other options then scrollbar?