2

是否可以动态覆盖css?

就像在 css 中我们指定

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

是否可以对 jquery css 做同样的事情?

我试过了

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

但这不起作用。

4

9 回答 9

2

最好的方法是覆盖样式是使用 css,而不是 jquery。你只能用 jquery 添加一个类,并在你的样式表中定义其余部分。

//script to add a class, this can be anything
$('.mainDiv').click(function(){
    $(this).addClass('active');
});

//css to define the different min-heights. (I would not recommend using !important)
.mainDiv {
   min-height:100px !important;
}

.mainDiv.active {
   min-height:200px !important;
}
于 2013-08-07T09:15:08.367 回答
1

试试看,importantJQuery 不支持

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

由于这将是内联 CSS,因此它将具有优先权

于 2013-08-07T09:15:36.367 回答
1

绝对可以动态覆盖 CSS。是没有被应用的 !important 属性吗?

确实不能用 .css() 方法添加。但是,您可以使用 .attr() 方法实现此目的:

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

资料来源: 如何使用 .css() 应用 !important?

于 2013-08-07T09:35:32.990 回答
0

尝试

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

演示:小提琴

于 2013-08-07T09:12:28.683 回答
0

代替引号 ("),使用反引号代替 `,这是 jQuery 更新 css 的唯一方式。

$(\`.mainDiv").css({"min-height" : ($(window).height() * 0.7) +"px !important\`});
于 2013-08-07T09:12:34.730 回答
0

尝试不使用 {}

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

您可能还需要单独进行计算,将其保存在变量中,然后只使用此变量,例如:

var newHeight = $(window).height() * 0.7;
$(".mainDiv").css("min-height", newHeight +"px");
于 2013-08-07T09:15:26.617 回答
0

试试这个

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

要不就

$(".mainDiv").attr('style',"min-height:"+($(window).height() * 0.7) +"px !important;");
于 2013-08-07T09:16:03.283 回答
0

检查这个小提琴。你可以试试$(".mainDiv").css({"min-height" : ($(window).height() * 0.7) +"px"});

于 2013-08-07T09:16:16.967 回答
0

你可以试试这个

$(document).ready(function() {
    $(".mainDiv").attr('style', 'min-height: ' +($(window).height() * 0.7) +"px !important");
});

小提琴演示

参考更多参考这里

于 2013-08-07T09:21:08.720 回答