如何在模態窗口上方顯示工具提示內容？

下面是我寫的用於顯示工具提示內容的代碼。由於模態窗口小於工具提示內容，因此我需要在模態窗口上方顯示工具提示內容，而不是在內部生成它。我嘗試使用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>

來源

2012-03-29 user1266343

用「<！DOCTYPE html>」工作沒有問題 – pushistic 2012-03-29 06:45:12

也許我不理解你..如果你想要提升工具提示，你可以使用「top：-Npx」或「margin-top：-Npx」 – pushistic 2012-03-29 06:50:59

因爲我沒有alowwed張貼圖像在這裏， http://i54.tinypic.com/246w57l。 png 模態窗口將像黃色矩形一樣，工具提示將像紫色矩形一樣。 – user1266343 2012-03-29 09:21:26

嘗試改變

<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）檢票口的模態窗口

有20001的z-index，你應該使用Firebug檢查（或wathever）你的模態窗口

來源

2012-03-30 19:29:56 osdamv

仍然沒有爲我工作:(即時通訊使用1.4.18版本。 – user1266343 2012-04-02 06:53:19

如何在模態窗口上方顯示工具提示內容？

回答

相關問題