仅冻结顶行和滚动内容

Freeze top row and scrolling contents only

提问人:Jeong-han Ahn 提问时间:4/1/2020 最后编辑:Jeong-han Ahn 更新时间:4/1/2020 访问量:90

问:

实际代码是由 javascript 和 jquery 生成的,但我只是创建了如下所示的 html 代码,仅用于测试。

<head>

    <style>
        body {
            overflow: hidden;
        }
    </style>

</head>
<body>
    <div id="root">
        <div style="height: 40px; overflow: hidden;">Title</div>
        <div style="overflow-x: auto; height: 100%;">
            <ul>
                <li>a</li>
                <li>b</li>
                <li>c</li>
                <li>d</li>
                <li>e</li>
                <li>f</li>
                <li>g</li>
                <li>h</li>
                <li>i</li>
                <li>j</li>
                <li>k</li>
                <li>l</li>
                <li>m</li>
                <li>n</li>
                <li>o</li>
                <li>p</li>
                <li>q</li>
                <li>r</li>
                <li>s</li>
                <li>t</li>
                <li>u</li>
                <li>v</li>
                <li>w</li>
                <li>x</li>
                <li>y</li>
                <li>z</li>
                <li>a</li>
                <li>b</li>
                <li>c</li>
                <li>d</li>
                <li>e</li>
                <li>f</li>
                <li>g</li>
                <li>h</li>
                <li>i</li>
                <li>j</li>
                <li>k</li>
                <li>l</li>
                <li>m</li>
                <li>n</li>
                <li>o</li>
                <li>p</li>
                <li>q</li>
                <li>r</li>
                <li>s</li>
                <li>t</li>
                <li>u</li>
                <li>v</li>
                <li>w</li>
                <li>x</li>
                <li>y</li>
                <li>z</li>
            </ul>
        </div>
    </div>
</body>
</html>

当我在大多数浏览器中运行上述代码时,它会按我的预期运行。(我在 IE-11、Edge 和 Chrome 中运行了这个) 浏览器的滚动被隐藏,标题 div 区域被冻结,列表区域有一个滚动。 但是当我使用 IE-11 和 IE-7 渲染模拟此代码时,浏览器的滚动再次显示,并且整个页面被滚动,包括标题 div 区域。 有没有人给我解决这个问题的提示?

HTML 互联网浏览器 7

评论

1赞 Daniel A. White 4/1/2020
你是说你想支持像渲染一样的IE7吗?那是在要求一个糟糕的时间......
0赞 Jeong-han Ahn 4/1/2020
是的,但我只想知道为什么 div 标签的溢出属性在 IE-7 中没有正确应用。
0赞 Daniel A. White 4/1/2020
也许 IE7 从未以您期望的方式支持它。
1赞 Chaska 4/1/2020
您可以尝试,但不确定这是否有效<body scroll="no">
0赞 Yu Zhou 4/1/2020
我重现了这个问题。也许 IE 7 与该用法不兼容。IE 7 太古老了,以至于我找不到有关此问题的文档。此外,我赞成 Chaska 的评论,它适用于 IE 7。

答: 暂无答案