如何解决.ui-dialog button.ui-button.ui-state-hover .ui-button-text{color:black} 到 jquery
我一整天都在尝试将 CSS
转换为 jQuery
,但没有成功。
CSS 代码:
.ui-dialog button.ui-button.ui-state-hover .ui-button-text{color:black}
我认为它可能是这样的。
jQuery :
$(".ui-dialog > button.ui-button.ui-state-hover > .ui-button-text").css('color','black');
但是它不起作用。目标是在悬停按钮时更改 jquery-ui dialog
的按钮文本颜色。
任何帮助将不胜感激! 非常感谢您提前! 再见
解决方法
以下是基于 jQuery 演示的演示:
$(function() {
$("#dialog-confirm").dialog({
resizable: false,height: "auto",width: 400,modal: true,buttons: {
"Delete all items": function() {
$(this).dialog("close");
},Cancel: function() {
$(this).dialog("close");
}
}
});
$(".ui-dialog .ui-dialog-buttonset button").hover(function() {
$(this).addClass("ui-state-highlight");
},function() {
$(this).removeClass("ui-state-highlight");
});
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id="dialog-confirm" title="Empty the recycle bin?">
<p><span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
</div>
<p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum,enim faucibus aliquet rhoncus,arcu felis ultricies neque,sit amet auctor elit eros a lectus.</p>
主题
对话框小部件使用 jQuery UI CSS 框架来设计其外观和风格。如果需要特定于对话框的样式,以下 CSS 类名称可用于覆盖或用作 classes 选项的键:
ui-dialog
:对话框的外部容器。
ui-dialog-buttonset
:按钮本身周围的容器。
上面的示例使用 hover()
添加和删除可用于设置对话框内按钮样式的类。查看更多:https://api.jqueryui.com/dialog/
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。