jquery - jqueryを使用してcssを動的にオーバーライドすることは可能ですか?

Question

css を動的にオーバーライドすることは可能ですか?

css のように指定します

.mainDiv{
   min-height:100px !important
 }

jquery cssで同じことをすることは可能ですか?

私はもう試した

$(".mainDiv").css({"min-height" : ($(window).height() * 0.7) +"px !important"});

しかし、これはうまくいきません。

Answer 1

CSS を動的にオーバーライドすることは間違いなく可能です。適用されていないのは !important 属性ですか?

.css() メソッドで追加できないのは事実です。ただし、これは .attr() メソッドで実現できます。

$(".mainDiv").attr("style", "min-height: " + ($(window).height() * 0.7) +"px !important");

ソース: .css() を使用して !important を適用する方法?

Answer 2

試す

$(".mainDiv").css({"min-height" : ($(window).height() * 0.7) +"px"});

デモ:フィドル

Answer 3

引用符 (") の代わりに、` の代わりにバック ティックを使用します。これが、jQuery が css を更新する唯一の方法です。

$(\`.mainDiv").css({"min-height" : ($(window).height() * 0.7) +"px !important\`});

Answer 4

このフィドルを確認してください。あなたが試すことができます$(".mainDiv").css({"min-height" : ($(window).height() * 0.7) +"px"});