1

我刚刚在我的网站http://lju.me上发现 Safari 处理 CSS3 转换的方式与 Chrome 完全不同。该网站行为方式的主要要点是我有一个名为“warp”的外部 div,围绕着四个内部 div,如下所示

<div id="warp">
    <div id="one" class="slice"></div>
    <div id="two" class="slice"></div>
    <div id="three" class="slice"></div>
    <div id="four" class="slice"></div>
</div>

假设第一个内部 div 被点击。然后我将 .goOne 类应用到#warp

#warp.goOne {
    // floating, positioning and transition code here
    -webkit-transform: scaleX(4);
    -moz-transform: scaleX(4);
    transform: scaleX(4);
}

#warp.goOne div{
    // floating, positioning and transition code here
    -webkit-transform: scaleX(.25);
    -moz-transform: scaleX(.25);
    transform: scaleX(.25);
}

基本上,主要思想是在这个小提琴http://jsfiddle.net/qwdM4/(虽然我听说那里的失真并不那么糟糕(我没有野生动物园,所以我不知道))。你们能否告诉我为什么这在 Chrome 上完全可以正常工作,但在 Safari 上却不行?

4

0 回答 0