java - 如何在模态窗口上方显示工具提示内容?

标签 java javascript tooltip overlay wicket

下面是我编写的用于显示工具提示内容的代码。由于模态窗口小于工具提示内容,我需要在模态窗口上方显示工具提示内容,而不是在内部生成它。我尝试使用 Z-index,但效果不佳。谁能帮我解决这个问题?

 <html>
        <head>
        <wicket:head>
                <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"/>
                <link rel="stylesheet" type="text/css" href="css/SendTestEmailPanel.css"/>
                <script src="/scripts/bt-0.9.5-rc1/jquery.bt.min.js" type="text/javascript"></script>
                <script src="/scripts/jquery.hoverIntent.minified.js" type="text/javascript"></script>
                <script src="/scripts/bgiframe_2.1.1/jquery.bgiframe.min.js" type="text/javascript"></script>

        </wicket:head>

</head>
<body>
<wicket:panel xmlns:wicket="http://wicket.apache.org/">

        <div id="send-test-email-panel">
                <h1>Test</h1>
                                <div id="tool-tip-div">
                                        <div style="float:left; margin-top:4px; margin-left:275px;position:absolute;z-index:2">
                                            <span class="help" id="email-address-tooltip" title="placeholder_text">&nbsp;</span>
                                        </div>
                                </div>
        </div>
        <div id="email-tooltip-content" style="display:none">
                <ul>
                        <li>To preview what your email fans will see, enter your email address and send a test to yourself.</li>
                        <li>Links and buttons will be inactive in the test email. </li>
                        <li>In the live email, the Grab It Now button links to your offer. If your fan is on a desktop computer, they will see the full web version of your offer. If they are viewing the email on their phone, they'll go directly to the mobile version of your offer.</li>
                </ul>
        </div>
        <script type="text/javascript">                                                                    
                var trigger = ['mouseover', 'mouseout'];
                var width = '180px';
                var pos = 'right';                    

                ShowPopup($('#email-tooltip-content'),
                $('#email-address-tooltip'),
                trigger,
                "$('#email-tooltip-content').html()",
                width,
                pos
        );             
        </script>
</wicket:panel>
</body>
</html>

最佳答案

尝试改变

<div style="float:left; margin-top:4px; margin-left:275px;position:absolute;z-index:2;">

对于

<div style="float:left; margin-top:4px; margin-left:275px;position:absolute;z-index:30001;">

在我的版本(1.5)中,wicket 的模态窗口的 z-index 为 20001,您应该使用 firebug(或其他)检查您的模态窗口

关于java - 如何在模态窗口上方显示工具提示内容?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9920131/

相关文章:

html - 如何增加 <a> 标题属性(工具提示)的默认悬停持续时间

javascript - 在 D3 map 上显示工具提示

java - 将我的 writeJsonFile 函数从 GSON 更改为 Jackson

javascript - 在 AngularJS 中从 Controller 范围之外访问模型数据

javascript - 在我的文件中找不到任何导致 Uncaught RangeError : Maximum call stack exceeded 的递归

javascript - 响应式平滑滚动 CSS3 动画?

jquery - 如何创建类似于 Google+ 中的工具提示?

java - 使用 Spring Integration 时抛出不同的 JSchException

java - 需要为字符串文字定义一个常量[SonarQube Smell]

java - 乘法比分支更快