使用 ui-dialog-background 透明对话框更改背景颜色答案

【问题标题】：change background color with ui-dialog-background transparent dialog使用 ui-dialog-background 透明对话框更改背景颜色
【发布时间】：2023-03-30 03:06:01
【问题描述】：

早安，

我真的被困在这里了。感谢这个博客，我有一个透明的工作背景：http://tqclarkson.com/2012/04/19/transparent-jquery-mobile-dialogs/

但无论我尝试什么，我都无法让透明背景变成不同的颜色。弹出对话框时，我需要父内容的背景颜色为黑色和透明。到目前为止，根据博客，我有这个：

.ui-dialog-background {
opacity: 0.5;
display: block !important;
-webkit-transition: opacity 0.5s ease-in;
}

.ui-dialog-background.pop.in {
opacity: 1;
-webkit-transition: opacity 0.5s ease-in;
}

.ui-dialog {
min-height: 100% !important;
background: transparent !important;
}

还有 JS：

$(function() {
    $('div[data-role="dialog"]').live('pagebeforeshow', function(e, ui) {
    ui.prevPage.addClass("ui-dialog-background ");
   });

$('div[data-role="dialog"]').live('pagehide', function(e, ui) {
    $(".ui-dialog-background ").removeClass("ui-dialog-background ");
   });
});

我尝试了各种不同的方法，但都没有奏效。有什么办法可以让透明背景颜色变深？

谢谢你，维克多。

【问题讨论】：

标签： javascript jquery css jquery-mobile

【解决方案1】：

这个先前的答案可能会解决您正在尝试做的事情：How to code a JavaScript modal popup (to replace Ajax)?

我已经使用了这种方法，它可以很好地在模态可见时将背景“变灰”。您应该能够更改颜色和/或不透明度以满足您的需要。

【讨论】：

还有其他建议吗？