javascript – Firefox 14打破3D’卡片翻转’效果 – 有谁知道为什么?

前端之家收集整理的这篇文章主要介绍了javascript – Firefox 14打破3D’卡片翻转’效果 – 有谁知道为什么?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

建立了一个网站,其中大部分依赖于通过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');
                }
            });

标记看起来像这样:

Boxes">
Box floated-Box">
最佳答案
这实际上是因为Firefox遵循最新标准.从https://developer.mozilla.org/en/Firefox_14_for_developers

As it has been removed from the draft standard,support for the skew()
function has been removed from transform property.

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

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

原文链接:https://www.f2er.com/css/427111.html

猜你在找的CSS相关文章