jquery - jQueryは特定のメディアタイプのCSSを変更できますか？

Question

jQueryが特定のメディアタイプ（印刷など）のCSSを変更することは可能ですか？

私の特定の問題は、要素にアニメーションを使用していて、それが印刷スタイルシートをオーバーライドしているため、印刷レイアウトが台無しになっていることです。私の問題は、提起された一般的な質問とは少し異なりますが、答えは私の問題を解決するのに役立つと思います。考えられる回避策も役立ちます。とても感謝しております。

Answer 1

Javascript でこれを行う必要はありません。@mediaCSS ドキュメントでルールを使用するだけです。これらすべてをたった 1 つの css ファイルに記述できます。ここに特定のW3Cドキュメントがあります

@media screen {

/* all your fancy screen css with a bunch of animation stuff*/

}

@media print {

/* all your fancy print css just plain */

}

非常に具体的な宣言を記述し、すべての要素をニーズに合わせることができます。ところで、それは IE6 までサポートされています。私たちのプロジェクトでは魅力のように機能します。

@media print {
   body { font-size: 10pt }
}

@media screen {
   body { font-size: 13px }
}

@media screen, print {
   body { line-height: 1.2 }
}

Answer 2

要素を非表示にする特定のルールを使用して、メディア (印刷) の css を追加します (例: #div { display: none; })

スクリプトで、これが次の場合：

$('#div').is(':visible')

が true の場合、あなたは印刷媒体 (印刷) に載っています。