2010-09-27 96 views
0

下面是一些代码,我使用的工具提示悬停在其元素上方,所以它不会弹出如下,并强制用户滚动查看它。它在除IE以外的所有浏览器中都能正常工作。在IE中,它位于元素下面而不是上面。IE位置问题的工具提示

我该如何修复IE的定位错误?我难倒了。

<style type="text/css"> 
.ToolTip 
{ 
    border: 2px solid black; 
    background:#fff; 
    display:none; 
    padding:10px; 
    width: 325px; 

    z-index:1000; 
    -moz-border-radius:4px; 
} 
</style> 

    <script language="javascript" type="text/javascript"> 
     $(document).ready(function() { 


    $(".tip_holder").hover(
       function() { 
        var $containerWidth = $(this).width(); 
        var $offset = $(this).offset(); 

        $('#ToolTipPopUp') 
         .prepend('<div id="tooltip" class="ToolTip">' + $("#ToolTipHolder").text() + '</div>'); 

        var $tipWidth = $('#tooltip').width(); 
        var $tipHeight = $('#tooltip').height(); 

        $('#tooltip').css({ 
         'top': $offset.top - ($tipHeight + 15), 
         'left': $offset.left - ($tipWidth - $containerWidth)/2, 
         'position': 'absolute', 
         'display': 'block' 
        }); 

       }, 
       function() { 
        $('#tooltip').remove(); 
       } 
      ); 

     }); 

    </script> 


<img src="/Content/Images/WhatsThis.png" class="tip_holder" /> 
        <div> 
         <div id="ToolTipPopUp"></div>  
         <span id="ToolTipHolder" style="display:none;">For Visa, MasterCard 
          and Discover, the card verification number is a 3-digit security code that is printed 
          on the back of your card. 
          <br /> 
          <br /> 
          For American Express, the card verification number is 4-digits and appears on the 
          front of the card. The number appears on the signature strip after the last four 
          digits of your account number. 
         </span> 
        </div> 
+0

看起来像JS文件CurvyConrers导致一些IE问题。将报告我发现的内容。 – Todd 2010-09-27 19:11:37

回答

2

IE会令你疯狂。如果你不介意使用javascript来解决这个问题,你可以使用http://rafael.adm.br/css_browser_selector/或者你可以使用条件语句来为IE使用不同的样式表,如下所示:<!--[if IE 8]> link your stylesheet here <![endif]-->你可以使用几个不同版本的if语句,只需google“IE if声明”。

+1

我使用浏览器选择器,太棒了! +1 – Kyle 2010-09-28 07:40:24