IE10中的线性渐变表演"怪异"

时间:2014-10-02 20:44:12

标签: css internet-explorer

这是一个小提琴:

http://jsfiddle.net/e80fen4p/2/

编辑:您可以突出显示所有结果div,您会看到颜色变回原来的颜色。我猜这里没有解决办法。如果通过突出显示它很容易“修复”它,它可能不是代码的问题。

基本上它在IE11以及chrome和Firefox中都能正常工作,但是如果你在IE10中这样做,你会注意到当div div滑动时,背景颜色在子div中重新开始,而不是延伸到包含孩子div扩展了。

如果你在IE10中尝试这个小提琴,你应该明白我的意思。它在所有其他浏览器中看起来都很正常。

我想知道我是否可以做些什么来修改我的CSS代码,使其在IE10中也能正常工作。

我试过了:

background-image: -ms-linear-gradient(top, #FFFFFF 0%, #A4A4A4 100%);

但它在IE10中仍然没有做任何不同的事情。 我使用它的正常方式是

background: linear-gradient(#FFFFFF, #A4A4A4);

适用于IE11和所有其他浏览器。它似乎只是IE10让我经历了一个循环。

奇怪的是,如果我打开开发人员工具并突出显示任何div,颜色会重置并看起来像div扩展时应该看起来。对我来说,这显然是IE10在第一次运行代码时如何显示它的错误。

我能做的任何事情或只是IE10的人都会看到它略有不同。这个错误不会阻止我的代码工作或者网页不可用只会让它看起来很奇怪。

1 个答案:

答案 0 :(得分:1)

我补充说:

height: 100%;
margin: 0;
background-repeat: no-repeat;
background-attachment: fixed;

它开始工作了。 它并不完美,它不完全一样,但至少它的工作。

不同之处在于它最小化(slideToggled)它只显示div颜色的顶部,它没有显示最小化div中的完整渐变,但这不是什么大问题,只是装饰性的。它比它正在做的更好。