IE 9 中的 Javascript 浮动框无法正确显示答案

【问题标题】：Javascript floating box in IE 9 not displayed properlyIE 9 中的 Javascript 浮动框无法正确显示
【发布时间】：2016-11-23 08:55:28
【问题描述】：

我的网站上的一个浮动框有问题，这个浮动框是用 JavaScript 创建的（我自己没有编写代码）。这个浮动框的代码如下所示：

<!-- START - popup-box -->

<script type="text/javascript">
var infobox_open = true;
function slide_infobox(){
    if(infobox_open){
        $("#infobox").animate({left:-180},500);
        infobox_open = false;
    }else{
        $("#infobox").animate({left:0},500);
        infobox_open = true;
    }
}
</script>
<div id="infobox" class="infobox_container">
    <div class="infobox_content">
        <float-title>MY TITLE</float-title>

<div>
<script type="text/javascript" src="//app.example.com/data/webforms/191361/j171g722op1.js?v12"></script>
</div>
<div>
<a class="povprasevanje" href="http://www.example.com/link/">Pošljite povpraševanje</a>
</div>




    </div>
    <div class="infobox_button" id="infobox_button">
        <a href="javascript:slide_infobox();"><img src="http://www.example.com/infobox_button.png" /></a>
    </div>
    <div class="clear"></div>
</div>
<!-- END - popup-box -->

在 FF、Opera、Chrome 浏览器中它可以正常显示（参见示例 here），但在 IE 浏览器中（当前正在查看 IE 9），情况并非如此，因为它浮动太高。请参阅this image 了解不同之处。不过，它在 Microsoft Edge 浏览器中可以正常工作。

我想问题是：我该如何解决这个问题，为了让 IE 9 正确显示它，JavaScript 代码本身应该做些什么？

【问题讨论】：

这看起来更像是 CSS 问题而不是 JS 问题
绝对定位你的 div，清除任何浮动

标签： javascript jquery html css internet-explorer

【解决方案1】：

这似乎是一个 CSS 问题，而不是 JS。

所以在你的 CSS 代码中添加这个：

#infobox {
    position: absolute;  // It should be positioned absolute
    top: 200px; // Or the pixels from top or from relative parent you want
}

它应该可以工作。如果不是，请更新您的代码并添加您的 CSS 代码。

【讨论】：