IE 10 &11 使用鼠标滚轮滚动时使固定背景跳跃 [英] IE 10 & 11 make fixed backgrounds jump when scrolling with mouse wheel
问题描述
当您在 Windows 8 中使用鼠标滚轮滚动时,固定的背景图像会像疯了一样四处弹跳.这仅影响 IE 10 和 IE 11.这也会影响具有 position:fixed
的元素.这是一个带有固定背景图像的示例:
When you scroll with the mouse wheel in Windows 8 the fixed background image bounces around like crazy. This only affects IE 10 and IE 11. This affects elements with position:fixed
as well.
Here is an example with a fixed background-image:
http://www.catcubed.com/test/bg-img-fixed.html
这是示例代码:
#section{
position: fixed;
top:0;
left:0;
background-color:#eee;
background-position: top left;
background-image: url("images/7.png");
background-size: auto;
background-repeat: no-repeat;
z-index: 10;
}
有没有办法在 IE 10 和 11 中保持背景不变?
Is there a solution to keep the background still in IE 10 and 11?
推荐答案
我知道现在给出答案有点晚了,但我遇到了同样的问题,并且能够通过将这些属性添加到我的 css 文件中来修复它
I know it is a bit late for an answer but I've had the same problem and was able to fix it by adding these attributes to my css file
html{
overflow: hidden;
height: 100%;
}
body{
overflow: auto;
height: 100%;
}
来自评论:
此解决方案会阻止滚动事件在窗口上触发,因此如果您使用依赖于此类事件触发的任何内容,请务必小心.codepen.io/anon/pen/VawZEV?editors=1111(溢出:隐藏,滚动事件不起作用)codepen.io/anon/pen/PNoYXY?editors=1111(溢出:自动,滚动事件触发)- Dan Abrey
This solution stops scroll events from firing on the window, so do be careful if you're using anything that relies on such events firing. codepen.io/anon/pen/VawZEV?editors=1111 ( overflow: hidden, scroll events don't work) codepen.io/anon/pen/PNoYXY?editors=1111 ( overflow: auto, scroll events fire) - Dan Abrey
所以这可能会导致您的项目出现一些问题.但我没有看到另一种解决 IE 中此错误的方法.
So this might cause some problems in your projects. But I don't see another way to workaround this bug in IE.
这篇关于IE 10 &11 使用鼠标滚轮滚动时使固定背景跳跃的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!