jQuery2.1.0にて-webkit-transitionが無効になるバグ
Updated / Published
jQuery2.1.0にはCSS()メソッドで指定した-webkit-transitionのスタイル情報が無効になるバグがあります。このバグはjQuery2.1.1にて改善される予定です。
jQuery2.1.0における-webkit-transitionスタイル無効の再現例
$('#test').css({
'-webkit-transition': '-webkit-transform 1s',
'transition': 'transform 1s'
});上記のようにCSS()メソッドでChrome, Opera, Safariなどのための-webkit-transitionのスタイル情報が指定されていても、jQuery2.1.0では適用されません。これはjQuery2.1.0にてベンダープレフィックス（接頭辞）を自動的につける部分に誤りがあったためで、このバグはすでにjQueryのBUG TRACKERに報告され、fix済であり、jQuery2.1.1にて改善予定です。
jQuery1.11.0においても同様の問題が再現される?!
気になるのは、自分が検証している限りでは、jQuery2.1.0と同時にリリースされたjQuery1.11.0でも同様にCSS()メソッドで-webkit-transitionのスタイル情報が指定されている場合に、適用されないことが再現されるにもかかわらず、jQuery 1.11.1のマイルストーンには、このバグは未だ報告もされていなければ、jQuery 1.11.1マイルストーンのCSS部分でfixにもfix対象にもなっていないということ。うーん、謎。jQuery1系はIE8以下専用に、IE9以上およびその他モダンブラウザはjQuery2系を専用に使いなさいということなのか。たしかにそうすれば問題はないのだから、もちろんそれで良いわけですが。
なお、どうしてもIE8以下も捨てきれないという場合でも、以下のようにIE用のコンディショナルコメントでも使えば、IE8以下にはjQuery1系を、それ以外のブラウザにはjQuery2系をそれぞれ分けて読み込ませることができます。
<!--[if lt IE 9]>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.xx.x/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/js/jquery-1.xx.x.min.js"><\/script>')</script>
<![endif]-->
<!--[if gte IE 9]><!-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.x.x/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/js/jquery-2.x.x.min.js"><\/script>')</script>
<!--<![endif]-->