如何将CSS主题仅应用于特定的jQuery-UI元素？-HowtoapplyCSSthemetoonlyaspecificjQuery-UIelement?

8  

$(window).load(function() {
   $('#ui-datepicker-div').addClass('CSS-Scope-Class');
});

The .addClass() jQuery function will add the necessary class to the datepicker for it to be picked up by the themed stylesheet.

.addClass()jQuery函数将为datepicker添加必要的类,以便由主题样式表拾取。

I had to attach to the window's load event rather than the document's ready event because the datepicker had not been inserted by then.

我不得不附加到窗口的加载事件而不是文档的ready事件,因为那时还没有插入datepicker。

Note: There will be a small delay between the time the datepicker is added to the DOM and the new class applied, which means the datepicker may appear unstyled while the page is finishing loading.

注意:将datepicker添加到DOM和应用新类之间会有一个小的延迟,这意味着在页面加载完成时,datepicker可能看起来没有样式。

4  

You can customize your theme with the theme roller here http://jqueryui.com/themeroller/

您可以使用主题滚轮自定义主题http://jqueryui.com/themeroller/

Find the item you want to style with Firebug's inspect DOM feature to target the class you want to select.

使用Firebug的inspect DOM功能找到要设置样式的项目,以定位要选择的类。

1  

I had the same problem with the datepicker and the accordion. I wanted the new styling of the datepicker but didn't want it for the accordion. I took the easy way out, I copied the relevant parts of ui.theme.css and added .ui-datepicker in front of all the styles. This targets just the datepicker and leaves all other UI plugins alone.

我和datepicker和手风琴有同样的问题。我想要使​​用日期选择器的新造型,但不希望它用于手风琴。我采取了简单的方法,我复制了ui.theme.css的相关部分,并在所有样式前添加了.ui-datepicker。这仅针对datepicker,并且仅保留所有其他UI插件。

I am not sure if it was the best way but it worked for my purposes.

我不确定这是否是最好的方式,但它对我的目的有效。

1  

I could be missing something but couldn't you just add a class to your date picker object and select on that?

我可能会遗漏一些东西,但你不能只是在日期选择器对象中添加一个类并选择它吗?

1  

Try: $('#cmsContent').css('margin', '0');

尝试:$('#cmsContent')。css('margin','0');

1  

Simply adding a css class to the datepicker div didn't work for me, I had to create another div around it like so:

简单地将一个css类添加到datepicker div对我来说不起作用,我不得不围绕它创建另一个div,如下所示:

$("#ui-datepicker-div").wrap('
');

0  

This works for me

这对我有用

$("#ui-datepicker-div").wrap("
");