jquery - 如何将 jQuery UI 主题应用到我的常规 html 中？

Question

我对各种小部件(如对话框、按钮等)使用 jQuery UI。我想继续对其他网页元素(如错误/警报通知和突出显示样式)使用该主题。所以我去themeroller页面查看他们使用的css周围，例如，警报通知:

<div class="ui-widget">
    <div style="padding: 0 .7em;" class="ui-state-error ui-corner-all"> 
        <p><span style="float: left; margin-right: .3em;" class="ui-icon ui-icon-alert"></span> 
        <strong>Alert:</strong> Sample ui-state-error style.</p>
    </div>
</div>

有一个包装器 div、带背景图标的 span 等。我是直接复制这些还是 jQuery UI javascript 为我创建一些？将主题应用于非小部件 html 的正确方法是什么？

Answer 1

只需将其应用到您自己的 HTML 中即可。不需要 JavaScript(悬停状态除外)。

当您使用 jQueryUI 的小部件时，Javascript 使用这些类创建所有 HTML。

如果您需要悬停状态，则必须切换 ui-state-hover 类。为此，您需要 Javascript:

$('.ui-state-error').hover(function(){
    $(this).toggleClass('ui-state-hover');
});