几个基础显示模态需要不同的背景

时间:2015-11-23 02:20:28

标签: javascript jquery html css zurb-foundation

我在一个页面上有2个基础显示模态。独立他们工作正常,除了我需要背景为一个是黑色而另一个是白色。不幸的是,揭示模式默认使用一个常见的背景(.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>

感谢您的任何见解。

1 个答案:

答案 0 :(得分:0)

您必须直接在CSS中处理此问题。您可以通过在有问题的模态中附加一个类并设置背景颜色来完成此操作。