クロムのJavascript/jQuery/CSSによる画像の彩度を落とす

グレースケールの画像をカラー画像（Chromeの）でレンダリングする方法がCSSまたはJavaScriptで表示されないようです。私はキャンバスのソリューションがChromeではうまくいかず、別のものを探している気がします。クロムのJavascript/jQuery/CSSによる画像の彩度を落とす

私はPixasticと他のjQueryソリューションを試してみましたが、役に立たないと思います。

出典

2011-07-20 Joseph Szymborski

「私はキャンバスソリューションはChromeで動作しないことを感じているし、別のを探していた」 - **なぜ**「私が試したPixastic？と他のjQueryソリューションの束 " - **何が間違っていますか？** [PixasticはChromeでうまくいきます。]（http://www.pixastic.com/lib/docs/actions/desaturate/） – thirtydot

私は試しましたこれに代わるものが多く、持続可能なものは何も見つかりませんでした。最終的なリゾート - 通常のもの...グレースケールはCSSを介して色と背景を切り替えることに付随しています。 – foxybagga

@thirtydot送信したページの最下部（[link]（http://www.pixastic.com/lib/docs/actions/desaturate/））を見ると、Chromeはサポートされているブラウザ –

私は一週間か二週間前に同じようなことをやってみたかったと、この例が見つかりました：

http://webdesignerwall.com/tutorials/html5-grayscale-image-hover

それは、キャンバスに画像をレンダリングすることをグレースケーリングして、Base64の表現を取得することによって動作します。それはIEのためではありませんが、あなたがChromeを指定して以来、あなたは行かなくてはなりません。 IEで画像をグレースケールだけで完全を期すため

は、私はJavascriptがあなたのための必要条件であるかどうかを知り、かあればしないでください

filter: gray;

CSSオプション

出典

2011-07-20 22:16:15 Dennis

私は以前これを見てきましたが、Chromiumでは動作していませんでしたが、Chromeで動作しています。ベータ版のブラウザでは動作するように要求することはできません。ありがとう！ –

現在、私はUbuntuの下でChromiumを稼働していて、正常に動作します。 – Dennis

で行うことができます動的な画像でこれを使用する予定ですが、CSS/HTMLのみを使用してこれを行う方法を説明するチュートリアルをまとめています。これは、opacityとtransitionスタイル宣言を使用します。これにより、2つの画像は、:hover擬似セレクタを使用して、2つの画像がそれらの間に「遷移錯視」を作成することができます。

それをチェックして、それが役に立ったら教えてください。 http://www.stephenwalcher.com/blog/2012/01/22/javascript-free-image-desaturat/

出典

2012-01-24 05:36:37

これが役立つことがあります。

filter: grayscale(100%); 
-webkit-filter: grayscale(100%); 
-moz-filter: grayscale(100%); 
-ms-filter: grayscale(100%); 
-o-filter: grayscale(100%);

出典

2012-11-20 23:44:17

クロムのJavascript/jQuery/CSSによる画像の彩度を落とす

答えて

関連する問題