GIve css3旋转到Chrome中的DIV,然后旋转到背景附件:固定的创建错误

前端之家收集整理的这篇文章主要介绍了GIve css3旋转到Chrome中的DIV,然后旋转到背景附件:固定的创建错误前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我的背景附件:固定正常工作。但是当我定义CSS3旋转该DIV并向下滚动然后background-attachment:固定停止工作。

检查这个http://jsfiddle.net/P3jS4/

现在我正在处理chrome18。

当您删除rotate css时,background-attachment:fixed工作正常。

http://jsfiddle.net/P3jS4/2

解决方法

这不是一个错误

你正在尝试做一些事情the spec还没有定义。它在评论中说:

What do fixed backgrounds do in transforms? They should probably
ignore the transform completely,since – even transformed – the object
should be acting as “porthole” through which the fixed background can
be viewed in its original form.

问题是“固定”是指相对于视口(浏览器窗口)而不是父元素。视口不旋转,只有一个视口。

鉴于规范尚未确定正确的方法,那么我们不知道“不工作”是什么意思。如果它在其他浏览器中“工作”,因为他们在不等待更新规范的情况下作出判断。你应该更新你的问题,以反映你想要的行为,而不是它是否“工作”。

在这个阶段,没有必要期待浏览器修复,因为你在规范之外工作。我的建议是修改您的代码,以便您通过以下方法之一遵循规范:

>使用img而不是背景
>使用画布或SVG
>在绘图程序中旋转背景
>将背景放在旋转元素后面的元素上

如果没有这些可以使用,并且没有其他解决方法可用,那么您的答案是无法完成。

更新:我刚刚意识到,我链接的规范已经超过了newer version,它将预期的行为澄清为:

Fixed backgrounds are affected by any transform specified for the root element,and not by any other transforms.

Thus an element with a fixed background still acts like a “porthole”
into an image that’s fixed to the viewport,and transforms on the
element affect the porthole,not the background behind it. On the
other hand,transforming the root element will still transform
everything on the page,rather than everything except for fixed
backgrounds.

假设通过“不工作”你的意思是背景不旋转,那么你正在做的不会在符合一致的浏览器中运行。

猜你在找的CSS相关文章