twitter-bootstrap jQuery 动态添加 CSS 类到 bootbox 模态
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/25089098/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery add CSS Class to bootbox Modal Dynamically
提问by SBB
I am using the jQuery plugin called Bootboxjs for my modals.
我正在为我的模态使用名为 Bootboxjs 的 jQuery 插件。
This is how I run the code:
这是我运行代码的方式:
bootbox.dialog({
title: '<i class="fa fa-thumbs-up"/></i> View Likes',
buttons: {
close: {
label: '<i class="fa fa-times"></i> Close',
className: "btn-danger",
callback: function() {
// Close the modal
}
}
},
message: '<span name="getLikesResults"></span>'
});
I am making a plugin for a project and I don't want this to affect existing modal styles but I need to make this specific modal scrollable when the content reaches the max height.
我正在为一个项目制作一个插件,我不希望这影响现有的模态样式,但是当内容达到最大高度时,我需要使这个特定的模态可滚动。
.modal .modal-body {
max-height: 420px;
overflow-y: auto;
}
How could I apply the above CSS to just this bootboxmodal?
我怎样才能将上面的 CSS 应用到这个bootbox模态?
采纳答案by Xm7X
You can try this
你可以试试这个
.bootbox-dialog .modal-body {
max-height: 420px;
overflow-y: auto;
}
Check out these examples
看看这些例子
http://bootboxjs.com/examples.html
http://bootboxjs.com/examples.html
Inspect the modals on the examples they each have a custom class. In the first example class bootbox-alert. In the second example class bootbox-confirm.
检查示例上的模态,它们每个都有一个自定义类。在第一个示例类 bootbox-alert 中。在第二个示例类 bootbox-confirm 中。
If your code follows the examples. Your code should have a class called bootbox-dialog on the modal.
如果您的代码遵循示例。您的代码应该在模态上有一个名为 bootbox-dialog 的类。
The bootbox docs show you can add a custom class name.
bootbox 文档显示您可以添加自定义类名。
http://bootboxjs.com/documentation.html
http://bootboxjs.com/documentation.html
This is a good write up on how the css selectors work.
这是一篇关于 css 选择器如何工作的好文章。
回答by JerryGoyal
I would suggest you to add class only to your modal that'll have all the required styles. You can do this way:
我建议您仅将类添加到具有所有必需样式的模态中。你可以这样做:
bootbox.dialog({
title: '<i class="fa fa-thumbs-up"/></i> View Likes',
buttons: {
close: {
label: '<i class="fa fa-times"></i> Close',
className: "btn-danger",
callback: function() {
// Close the modal
}
}
},
message: '<span name="getLikesResults"></span>'
}).addClass('bootboxDanger');
.bootboxDanger{
max-height: 420px;
overflow-y: auto;
}

