2012-07-19 3 views
5

DIVを3D効果で反転させることが大部分を占めるサイトを構築し、昨日のFF14にアップグレードしてその効果が壊れました。 FF13、Chrome、IE9などで正常に動作します。Firefox 14で3Dの「カードフリップ」効果が壊れます。

私は作業しているサイトを投稿できませんが、このサイトはまったく同じ方法で壊れています。カードの表と裏の間をジャンプしますむしろ

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

誰もが任意のアイデアを持って回転させるよりも?


EDIT:OK、おそらくより多くの情報

を含めるべきだった私はときに私私が間違っていたフリップ

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

を処理するために、このプラグインを使用していますこのプラグインはjQuery用であるのに対し、他のWebサイトと同じテクニックで、普通のCSSと思われます。ここでは、デモへのリンクは、私が一緒に

http://olliesilviotti.co.uk/the-laboratory/cards/demo/を投げたのです


EDIT:これは、クエリが使用されている方法です。

$('#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

FF 17aでも壊れています。 –

+0

マークアップの例と呼び出す場所がいいですが、プラグインのソースを確認します。 –

+0

マークアップとjQueryを今追加しました。私は、FFがプラグインではなく変換を処理する方法であるため、必要ではないと仮定しました – ollie

答えて

4

これは実際にはFirefoxがレイトに従うためですt基準。 )https://developer.mozilla.org/en/Firefox_14_for_developers

からそれがドラフト規格から削除されたように、スキューのサポート( 関数は、transformプロパティから削除されました。

(これは全体-moz-transform宣言がドロップされる原因となる。)

代わりのBugzillaのにバグを報告し、私はそれは、プラグインの作者に報告しなければならないと思います。

+0

なぜ私のコンソールがスパムを続けているのか理にかなっている。宣言は絶え間なく続きました。 +1の素晴らしい発見。 –

+0

おかげで、それは意味があります(しかし、ちょっと面倒です)。 スキューを使用せずにこの3D効果をシミュレートする他の方法は知っていますか? – ollie

+0

@ollie私は3D変換を試してみたいが、一度も使ったことはない。 3D変換仕様も最近変更されており、サポートは異なる可能性がありますのでご注意ください。 – duri

関連する問題