我的溢出y:滚动在chrome / firefox等中完美运行...但不是在IE中

时间:2014-02-21 19:17:04

标签: css internet-explorer overflow

这是css:

html {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

我有一个弹出了浏览器窗口定义尺寸的网页。我想要的就是弹出窗口上的垂直滚动。有人知道IE修复此问题吗?

1 个答案:

答案 0 :(得分:0)

我在IE中使用它的唯一方法(哦,我讨厌为IE设计 WORK 而不是通过标准工作),是通过javascript制作弹出窗口“window.open()”在我的按钮或超链接上点击事件并设置“scrollbars = yes”属性并将弹出窗口上的div设置为与window.open()调用中设置的属性相同的维度。这是一个例子:

<强> default.html中

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>stackoverflow IE popup scrollbars for George user3068590</title>
    <style type="text/css">
        html {
           height: 100%;
           overflow-x: hidden;
           overflow-y: auto;
}
    </style>
</head>
<body>
    <div><a href="#" onclick="window.open('popup.html', 'a', 'width=500, height=200, resizable=0, scrollbars=yes')">click</a></div>
</body>
</html>

<强> popup.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>stackoverflow IE popup scrollbars for George user3068590</title>
</head>
<body>
    <div style="width: 500px; height: 200px;">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tincidunt rutrum
    arcu, sit amet laoreet magna vestibulum quis. Suspendisse quis leo mi. Phasellus
    posuere enim in pretium blandit. Aenean sagittis turpis in velit fermentum mattis.
    Morbi porta eros in tristique dictum. Aenean quis ultricies odio. Aliquam id metus
    orci. Phasellus eu turpis tortor. Curabitur vestibulum arcu ut dolor tempor, in
    convallis urna convallis. Phasellus ultrices ipsum id feugiat sagittis. Sed suscipit
    quam sed dictum gravida. Cum sociis natoque penatibus et magnis dis parturient montes,
    nascetur ridiculus mus. Nulla odio metus, lacinia in hendrerit ut, vestibulum in
    dolor. Proin ullamcorper vitae mauris vitae convallis. Interdum et malesuada fames
    ac ante ipsum primis in faucibus. Sed in eros sed arcu volutpat blandit sit amet
    semper nisi.

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tincidunt rutrum
    arcu, sit amet laoreet magna vestibulum quis. Suspendisse quis leo mi. Phasellus
    posuere enim in pretium blandit. Aenean sagittis turpis in velit fermentum mattis.
    Morbi porta eros in tristique dictum. Aenean quis ultricies odio. Aliquam id metus
    orci. Phasellus eu turpis tortor. Curabitur vestibulum arcu ut dolor tempor, in
    convallis urna convallis. Phasellus ultrices ipsum id feugiat sagittis. Sed suscipit
    quam sed dictum gravida. Cum sociis natoque penatibus et magnis dis parturient montes,
    nascetur ridiculus mus. Nulla odio metus, lacinia in hendrerit ut, vestibulum in
    dolor. Proin ullamcorper vitae mauris vitae convallis. Interdum et malesuada fames
    ac ante ipsum primis in faucibus. Sed in eros sed arcu volutpat blandit sit amet
    semper nisi.
    </div>
</body>
</html>