Firefox 14打破3D'卡片翻转'效果 - 任何人都知道为什么?

时间:2012-07-19 08:42:32

标签: javascript jquery css firefox

建立了一个网站,其中大部分依赖于通过3D效果翻转DIV,昨天早上升级到FF14并且效果被打破。它在FF13,Chrome,IE9等中运行良好。

我无法发布我正在处理的网站,但是这个网站以完全相同的方式被破坏 - 它在卡片的正面和背面之间跳跃而不是旋转

http://jigoshop.com/product-category/extensions/

有人有什么想法吗?


编辑:好的,可能应该包含更多信息

我正在使用此插件来处理翻转

http://www.zachstronaut.com/projects/rotate3di/

当我说它与其他网站的技术相同时我错了,因为它似乎是纯CSS,而这个插件是用于jQuery的。这是我汇总的演示链接

http://olliesilviotti.co.uk/the-laboratory/cards/demo/


编辑:这是查询的使用方式:

$('#boxes .box div.back').hide().css('left', 0);

            function mySideChange(front) {
                if (front) {
                    $(this).parent().find('div.front').show();
                    $(this).parent().find('div.back').hide();

                } else {
                    $(this).parent().find('div.front').hide();
                    $(this).parent().find('div.back').show();
                }
            }


            $('#boxes .box').live('mouseover', function() {
                if (!$(this).data('init')) {
                    $(this).data('init', true);
                    $(this).hoverIntent({
                        over: function () {
                            $(this).find('div').stop().rotate3Di('flip', 250, {direction: 'clockwise', sideChange: mySideChange});
                        },
                        timeout: 1,
                        out: function () {
                            $(this).find('div').stop().rotate3Di('unflip', 500, {sideChange: mySideChange});
                        }
                    });
                    $(this).trigger('mouseover');
                }
            });

标记看起来像这样:

<div id="boxes">
        <div class="box floated-box">
                <div class="front">Random Number</div>
                <div class="back">I am the back of the card</div>
        </div>
</div>

1 个答案:

答案 0 :(得分:4)

这实际上是因为Firefox遵循最新标准。来自https://developer.mozilla.org/en/Firefox_14_for_developers

  

由于已从草案标准中删除,因此支持偏斜()   函数已从转换属性中删除。

(这会导致整个-moz-transform声明被删除。)

而不是向Bugzilla报告错误,我会说应该向插件的作者报告。