css - 嵌入式邮件列表代码中的 Z-index

Question

我有一个用于注册我们的邮件列表的弹出窗口。我需要它来覆盖一切。目前，CSS 菜单位于弹出窗口的顶部。菜单在 z 索引上为 9999。我在弹出代码的什么位置(见下文)添加 z 索引信息。

这是来自 Mail Chimp 的代码:

    <script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script>
    <script type="text/javascript">require(["mojo/signup-forms/Loader"], function(L) 
    {
         L.start({"baseUrl":"mc.us9.list-manage.com","uuid":"56eb37539d1e217bbc3a2ea22","lid":"d8e88803f2"}) 
    })
    </script>

Answer 1

您确实需要发布您的 HTML 和 CSS 以获得明确的答案，但您可以尝试以下操作:

确保您的弹出窗口覆盖层具有类名或 ID。例如:

<div id-"mailing-list-overlay">
    mailing list form goes here...
</div>

现在尝试在您的标记中的某处添加此 CSS 规则:

<style>
    #mailing-list-overlay {
        z-index: 10000 !important;
    }
</style>

如果可行，那就太好了!现在尝试删除 '!important' 并查看是否有效。 (确保在重新加载时清除浏览器缓存。)如果可行，请尝试将 css 规则移动到正确的样式表。

如果这些都不起作用，则可能是您遇到了不同的问题——例如，叠加层可能与您要叠加的内容不在同一层堆栈中。但是，如果不能看到更完整的 HTML 和 CSS 图片，就不可能排除故障。如果您将代码发布到 pastebin 或 jsfiddle，我可以帮助您。