-webkit-filterと-webkit-transitionを画像に適用し、ホバー時にフィルターを変更すると、画像の遷移はうまくいきますが、画像が非常にぼやけます。
注：これはRetinaディスプレイでのみ発生します。「通常の」ppiディスプレイではまったく問題ありませんが、たとえばRetinaディスプレイを搭載した新しいMacBookProではあいまいです。
私のCSS（ベンダープレフィックスなし）：
img {filter:grayscale(1);filter:saturate(0%);transition:2s ease;width:200px;height:200px}
img:hover {filter:grayscale(0)}
注：効果/バグを確認するために、transition-durationを2秒に設定しました
私のデモをチェックしてください：http：//jsfiddle.net/dya2t/7/
どうすればこれを修正できますか？
編集：： hover-stateをfilter：noneに設定すると、シャープになります！:-)しかし、もちろんトランジションはもう機能しません：-/画像にフィルターがあるとすぐに（値が0または0％であっても）、Retinaディスプレイで画像がぼやけます（トランジションの有無にかかわらず…いつもぼやけているだけです）。これはフィルターバグだと思います。
これはWebKitの既知のバグですhttps://bugs.webkit.org/show_bug.cgi?id=93471