CSS3旋转替代？

Question

我正在使用CSS3规则“旋转”来旋转包含div的文本。您可以在此处查看页面：http://vitaminjdesign.com/v2/socialmedia.html。我正在寻找跨浏览器支持来轮换div;但是，这个CSS3规则不适用于IE。是否有jQuery选项或其他JavaScript解决方案，可以产生相同的结果，并具有跨浏览器兼容性？

Answer 1

使用Sandpaper，您可以使用此CSS规则：

-sand-transform: rotate(90deg);

它可以在每个浏览器中运行 - 甚至在IE中。

Answer 2

如果您希望css轮换与旧版本的IE兼容，那么就有了 filter progid:DXImageTransform.Microsoft.Matrix为此，但它只能应用一次，并且在计算最终矩阵时会涉及许多计算。

Answer 3

我会使用Raphael和Cufon来做这类事情，虽然你必须在旋转时滚动自己的自动换行，因为你必须使用Raphael的print而不是Cufon的replace 。这样，字体就是矢量，旋转以纯粹的几何方式处理。

目前css-rotate的问题超出了跨浏览器的兼容性 - 在支持它的浏览器中，结果通常看起来像垃圾。我在Firefox 3.6中的网站看起来像是在不平衡的基线上的别名混搭。我知道你问了一个具体的问题，我尽力回答，但我对你的建议是放弃js库的开销，以达到你想要在这里完成的目标，并且只需要高质量的图像。您已经在“悬挂标签”背景图像中投入了带宽，因此向该图像添加文本的成本很低，而为您正确处理文本旋转问题的全新js库的成本将非常高。不是最先进的解决方案，我会授予你......但这就是我们今天所处的位置。