jQueryのスクロールエフェクトを使用してFirefoxで変換が機能しない

Question

Firefoxでスクロール効果がうまくいかない、Chrome、Safari、Operaでこのコードで問題なく動作している'-moz-transform'コード行。

私はFirefoxブラウザでチェックしているとそれだけで回転値がゼロのままで、次の

element { 
    transform: rotate(0deg); 
} 

を示し、私はjQueryのにかなり新しいですし、私はここからデバッグする方法がわからないです。以下のコードをご覧ください：

$(window).scroll(function(){ 


    var $cog = $('#my-div'), 
     $body = $(document.body), 
     bodyHeight = $body.height(); 

    $cog.css({ 
     'transform': 'rotate(' + ($body.scrollTop()/bodyHeight * -360) + 'deg)', 
     '-moz-transform': 'rotate(' + ($body.scrollTop()/bodyHeight * -360) + 'deg)', 
     '-webkit-transform': 'rotate(' + ($body.scrollTop()/bodyHeight * -360) + 'deg)', 
     '-o-transform': 'rotate(' + ($body.scrollTop()/bodyHeight * -360) + 'deg)' 
    }); 

}); 

Answer 1

問題が発生した場合は、この番号を使用してお知らせください。

$(window).on('scroll', function() { 
 

 
    var cog = $('div'), 
 
    body = $(document), 
 
    bodyHeight = body.height(); 
 

 
    cog.css({ 
 
    'transform': 'rotate(' + (body.scrollTop()/bodyHeight * -360) + 'deg)', 
 
    '-o-transform': 'rotate(' + (body.scrollTop()/bodyHeight * -360) + 'deg)', 
 
    '-moz-transform': 'rotate(' + (body.scrollTop()/bodyHeight * -360) + 'deg)', 
 
    '-webkit-transform': 'rotate(' + (body.scrollTop()/bodyHeight * -360) + 'deg)', 
 
    }); 
 

 
});

body { 
 
    min-height: 900px; 
 
} 
 
div { 
 
    transform: rotate(0deg); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    rotate this 
 
</div>

タグ（*）が検出されました前にスクリプトを実行しているので、document.bodyがnullの通常の理由があります。コードを見ることなく、私は確かに言うことはできませんが、それはいつもの理由でしょう。スクリプトを置いた場所を移動します。

詳細については、この質問をご覧ください。 __Firefox 47__で

Why is document.body == null in Firefox but not Safari