超级奇怪的Chrome / Safari css渲染错误

时间:2013-07-24 15:54:02

标签: css google-chrome rendering

所以我有一个切换按钮,可以在绝对定位的元素上切换'扩展'类。使用扩展类,元素被设置为具有0px的底部,没有它,它具有-400px的底部。

这个确切的设置在我做出一些改变之前按预期工作,但现在却没有。

这是奇怪的部分: 添加扩展类时,一切正常(元素向上移动到底部:0px)。当我点击切换按钮删除类时,类被删除并且正确的css规则到位(根据chrome检查器的匹配css规则),但底部根本没有变化(它一直显示为0px底部,即使铬检查员说它是-400px)。

如果我查看元素的计算样式,它会将底部显示为0px(此时它应该是-400px),但是当我打开它旁边的箭头以查看导致它的原因时,它会将其显示为样式表中的-400px正在应用chrome think。

如果我单步执行删除扩展类的函数,它会按预期工作,但如果我跳过该函数而不是它(我知道函数仍在运行,但是)。

另一个非常奇怪的事情是,当触发页面上完全独立元素的某些悬停状态时,底部会更新到正确的状态(不是每个元素的悬停,只是其中一些)。

在Safari和Chrome中都会发生这种情况,但在Firefox中则不会。

我认为这必须是Chrome中的一个错误,但考虑到在我做出的更改之前这个工作正常并且它在Safari中也可以重现,我觉得它必须与我的代码相关,但我可以'为了我的生活,弄清楚发生了什么。

我所做的更改似乎打破了这一点是一堆jQuery性能改进,但由于代码工作正常(类正在翻转),我只是不知道是什么原因造成的。

在运行OS X 10.8.3的视网膜MacBook Pro上使用Chrome 28.0.1500.71,Safari 6.0.3,Firefox 22.0

非常感谢任何帮助。

0 个答案:

没有答案