几种基础揭示模态需要不同的背景

Question

我在一页上有 2 个 Foundation 显示模式。独立它们工作正常，除了我需要一个黑色和另一个白色的背景。不幸的是，显示模式默认使用一种常见的背景（.reveal-modal-bg）。如何为此背景实现不同的样式或为每个模态赋予其独特的背景？这是我在页面上的调用：

<script>
$(document).foundation('reveal', 
{
animation: 'fade',
animation_speed: 200,
close_on_background_click: true,
dismiss_modal_class: 'close-reveal-modal',
multiple_opened: false,
bg_class: 'reveal-modal-bg',
root_element: 'body',
on_ajax_error: $.noop,
bg : $('.reveal-modal-bg'),
css : {
open : {
  'opacity': 0,
  'visibility': 'visible',
  'display': 'block',
  'transition': 'visibility 0s linear 0.2s, opacity 0.2s linear'
},
close : {
  'opacity': 1,
  'visibility': 'hidden',
  'display': 'none',
  'transition-delay': '0s'
}
}
});
</script>

感谢您的任何见解。

Answer 1

您必须直接在 CSS 中处理这个问题。您可以通过向相关模式附加一个额外的类并设置背景颜色来做到这一点。