次のCSSがあるとしましょう:
._gradient {
background-image: linear-gradient(top, #6AF 16px, #0032C8 24px);
background-image: -o-linear-gradient(top, #6AF 16px, #0032C8 24px);
background-image: -moz-linear-gradient(top, #6AF 16px, #0032C8 24px);
background-image: -webkit-linear-gradient(top, #6AF 16px, #0032C8 24px);
background-image: -ms-linear-gradient(top, #6AF 16px, #0032C8 24px);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(16px, #6AF),color-stop(24px, #0032C8));
}
グラデーションの位置/方向/色の値を読み取るためにJavascriptまたはjQueryで簡単な方法はありますか?
明らかに正規表現を使用できます...問題は、サイトにアクセスしているブラウザーに応じて異なる値を返す「背景画像」値にあります: jsFiddleの例
基本的に、これにより、linear-gradient()
値だけを試してみることになりました(ブラウザーを検出してjQueryでCSSを適用することを目的としています)が、値「none」が返されました:jsFiddle example 2
私の実際の目的は、スクリプトを使用してこれらの値を動的に取得することであり、設定することではありません (ただし、ソリューションでこれを行う必要があることを望んでいます)。
明確化のために編集
グラデーションがサポートされていなくても、グラデーションの値を読み取る方法を探しています。$.cssHooks
プロパティがサポートされていない場合、値「none」を返すため、使用は答えではありません。これには何のメリットもありません。