我有一个CSS类,我希望设置它的宽度属性:
ul.month-wrapper li
{
font-size: 13px;
}
ul.year-wrapper li
{
font-size: 16px;
}
和Jquery:
var MonthWidth = 30;
var YearWidth = MonthWidth * 12;
// Set CSS classes widths
$('ul.month-wrapper li').css('width', MonthWidth + 'px');
$('ul.year-wrapper li').css('width', YearWidth + 'px');
然而,这似乎没有做任何事情,宽度保持不变!有什么想法吗?
答案 0 :(得分:3)
您无法向CSS类添加任何内容。 CSS类是静态的。
您在上面做的是将width
样式属性添加到页面上li
的{{1}}类ul
中的任何控件.year-wrapper
我的猜测是,在列表项加载到页面之前,您在页面脚本中过早地运行此脚本。请尝试以下操作以确保页面已完成加载:
$(document).ready(function(){
var MonthWidth = 30;
var YearWidth = MonthWidth * 12;
// Set CSS classes widths
$('ul.month-wrapper li').css('width', MonthWidth + 'px');
$('ul.year-wrapper li').css('width', YearWidth + 'px');
});
答案 1 :(得分:2)
如果你真的想要修改类,你可以使用普通的普通旧Javascript,但jQuery中没有任何东西可以让它变得更容易:
var ss = document.styleSheets[0];
if(ss.insertRule){
ss.insertRule('ul.month-wrapper li {width: '+MonthWidth + 'px }', ss.cssRules.length);
ss.insertRule('ul.year-wrapper li {width: '+YearWidth + 'px }', ss.cssRules.length);
}else if(ss.addRule){ // For IE only
ss.addRule('ul.month-wrapper li', 'width: '+MonthWidth + 'px');
ss.addRule('ul.year-wrapper li', 'width: '+YearWidth + 'px');
}
跨浏览器向css类添加规则的示例:
http://jsfiddle.net/Paulpro/sMBeq/
这只是一个简单的例子btw,它将新规则附加到样式表中。如果您想要访问当前规则并只添加width:
样式,则会稍微复杂一些。