IE+溢出:隐藏

Posted

技术标签:

【中文标题】IE+溢出:隐藏【英文标题】:IE + overflow: hidden 【发布时间】:2014-03-25 09:10:52 【问题描述】:

我不知道这是一个问题还是错误,但是当我使用overflow: hidden,在IE中选择文本并将光标移动到页面底部时,页面正在滚动(我试过IE9-IE11)!当我使用 Firefox/Opera/Chrome/Safari 时,页面没有滚动……我必须使用overflow: hidden,但它在 IE 中有一个奇怪的行为。

所以,我的问题是:如何避免在 IE 中滚动页面?

【问题讨论】:

没有代码示例很难判断发生了什么。 这不是错误 - overflow: hidden 不会阻止滚动,它只是隐藏滚动 UI。 @easwee,这是我正在使用的代码 - jsfiddle.net/LwaDm 【参考方案1】:

你看过 -ms-overflow-style 属性了吗?

-ms-overflow-style: none;

更多信息在这里:http://msdn.microsoft.com/en-us/library/ie/hh771902(v=vs.85).aspx

【讨论】:

MSDN:“与溢出不同:隐藏,带有 -ms-overflow-style: none 的元素仍然可以通过触摸平移、键盘或鼠标滚轮滚动。”,但我必须完全禁用滚动.当我选择文本并将鼠标移动到页面底部时 - 它会滚动【参考方案2】:

我有一个解决方案,但不确定这是否正确,但您可以尝试一下。

http://jsfiddle.net/b5DYf/1/

html
  position:fixed;

【讨论】:

这肯定不是正确的方法,因为一旦扩展视口就会使内容无法访问! @Netsurfer 这就是 OP 想要做的事情 @Mr.Alien 我很确定他想为页面上的一个或多个元素执行此操作。但肯定不会将整个页面缩小到视口,并使所有扩展内容无法访问! @Netsurfer 是的,这很重要,虽然我觉得他想要页面 如何避免在 IE 中滚动页面? @Mr.Alien 是的,但不要错过部分:“...选择文本并将光标移动到页面...”!所以恕我直言,这个答案没有帮助,我想让作者有机会编辑它,而不仅仅是投反对票。我个人认为“这是一个功能,而不是一个错误!”。因为为什么内容不能访问!?如果这是需要的,为什么会在那里?【参考方案3】:

在 IE 10+ 中使用 -ms-scroll-limit: 0 0 0 0; 来防止任何滚动。 对于较旧的浏览器,您可以使用 javascript 编写解决方法。

CSS 和 JavaScript 示例:

body 
  overflow: hidden;
  -ms-scroll-limit: 0 0 0 0;

window.onscroll = function (event) 
  window.scrollTo(0, 0);

window.onscroll = function (event) 
  window.scrollTo(0, 0);
body 
  overflow: hidden;
  -ms-scroll-limit: 0 0 0 0;
    We choose to go to the moon in this decade and do the other things, not because they are easy, but because they are hard, because that goal will serve to organize and measure the best of our energies and skills, because that challenge is one that we are willing to accept, one we are unwilling to postpone, and one which we intend to win.

    We choose to go to the moon in this decade and do the other things, not because they are easy, but because they are hard, because that goal will serve to organize and measure the best of our energies and skills, because that challenge is one that we are willing to accept, one we are unwilling to postpone, and one which we intend to win.

    Never in all their history have men been able truly to conceive of the world as one: a single sphere, a globe, having the qualities of a globe, a round earth in which all the directions eventually meet, in which there is no center because every point, or none, is center — an equal earth which all men occupy as equals. The airman's earth, if free men make it, will be truly round: a globe in practice, not in theory.

    What was most significant about the lunar voyage was not that man set foot on the Moon but that they set eye on the earth.

    If you could see the earth illuminated when you were in a place as dark as night, it would look to you more splendid than the moon.

    When I orbited the Earth in a spaceship, I saw for the first time how beautiful our planet is. Mankind, let us preserve and increase this beauty, and not destroy it!

    Buy why, some say, the moon? Why choose this as our goal? And they may as well ask why climb the highest mountain?

    Across the sea of space, the stars are other suns.

    Many say exploration is part of our destiny, but it’s actually our duty to future generations and their quest to ensure the survival of the human species.

    As we got further and further away, it [the Earth] diminished in size. Finally it shrank to the size of a marble, the most beautiful you can imagine. That beautiful, warm, living object looked so fragile, so delicate, that if you touched it with a finger it would crumble and fall apart. Seeing this has to change a man.

    If you could see the earth illuminated when you were in a place as dark as night, it would look to you more splendid than the moon.

    We have an infinite amount to learn both from nature and from each other

    To go places and do things that have never been done before – that’s what living is all about.

    Spaceflights cannot be stopped. This is not the work of any one man or even a group of men. It is a historical process which mankind is carrying out in accordance with the natural laws of human development.

    Space, the final frontier. These are the voyages of the Starship Enterprise. Its five-year mission: to explore strange new worlds, to seek out new life and new civilizations, to boldly go where no man has gone before.

    To be the first to enter the cosmos, to engage, single-handed, in an unprecedented duel with nature—could one dream of anything more?

    We have an infinite amount to learn both from nature and from each other

    Many say exploration is part of our destiny, but it’s actually our duty to future generations and their quest to ensure the survival of the human species.

    NASA is not about the ‘Adventure of Human Space Exploration’…We won’t be doing it just to get out there in space – we’ll be doing it because the things we learn out there will be making life better for a lot of people who won’t be able to go.

    Never in all their history have men been able truly to conceive of the world as one: a single sphere, a globe, having the qualities of a globe, a round earth in which all the directions eventually meet, in which there is no center because every point, or none, is center — an equal earth which all men occupy as equals. The airman's earth, if free men make it, will be truly round: a globe in practice, not in theory.

    Where ignorance lurks, so too do the frontiers of discovery and imagination.

    Astronomy compels the soul to look upward, and leads us from this world to another.

    We have an infinite amount to learn both from nature and from each other

    Curious that we spend more time congratulating people who have succeeded than encouraging people who have not.

    Where ignorance lurks, so too do the frontiers of discovery and imagination.

    Curious that we spend more time congratulating people who have succeeded than encouraging people who have not.

    Where ignorance lurks, so too do the frontiers of discovery and imagination.

    A Chinese tale tells of some men sent to harm a young girl who, upon seeing her beauty, become her protectors rather than her violators. That's how I felt seeing the Earth for the first time. I could not help but love and cherish her.

    What was most significant about the lunar voyage was not that man set foot on the Moon but that they set eye on the earth.

    That's one small step for [a] man, one giant leap for mankind.

overflow: hidden 显然跨浏览器不一致,但我不知道哪个浏览器做得对。)

【讨论】:

这很好,但 MSDN 说,它受 IE10 及更高版本支持,并且仅在 Windows 8/Windows 8.1 上... 我可以确认它可以在 Windows 7 上的 IE 11 中运行。不幸的是,我不知道适用于 IE 9 及更早版本的解决方案。 IE8及更早版本没问题,但是IE9... JavaScript上有解决方案吗? 当然,可以用 JavaScript 解决这个问题。我用链接更新了答案。 我认为,这将是最后一个答案:在您的 JavaScript 代码中,您正在使用 ScroolTo 方法,但有没有办法取消该事件,而不仅仅是使用 ScroolTo

以上是关于IE+溢出:隐藏的主要内容,如果未能解决你的问题,请参考以下文章

CSS alpha opacity IE8 溢出被隐藏

溢出:在 IE8 中使用 css3pie 隐藏圆形边框?

怎样隐藏溢出DIV的内容

溢出隐藏在 Firefox 上不起作用

css / js 控制 文本溢出 省略号显示

如何使 CSS3 圆角在 Chrome/Opera 中隐藏溢出