Question

我需要在Web浏览器中将栏粘贴到客户端视图的底部。传统上我会使用position：fixed;除了我需要支持我的IE 6客户端。我有一个非常广泛的黑客将条形图粘贴到页面底部和内容上，但是当用户向下或向右滚动时，条形图保持固定在页面上。

为了解决这个问题，我使用了一个使用setInterval触发的javascript事件，当在IE（8）的调试工具中运行该函数时，事件触发并更改位置顶部和左侧属性，但页面不重绘元素。代码有效，但元素没有移动，见下文。

The example shown.

您知道，修复程序必须在IE怪癖模式下运行...如果其他IE版本试图使用标准，则无法正常工作。相信我，我试过了。

P.S。这真的是加重了，因为我正在仔细检查IE9支持...得到这个元素不会随着IE 6,7和8中的滚动条移动，但在IE 9中移动它仍然显示“IE Quirks模式。 “微软表示，此版本不会产生任何影响，......

HTML结构

<body>
    <div id="j_zoom_area" style="zoom:100%;">
        The Application area the the zoom is changed (by the bar) for accessibility...
    </div>
    <div id="j_protectorite">
        <div class="j_bar">
        <div class="j_plate">Zoom Controls, Help, Search, other misc controls</div>
        <div class="j_plate">Copyright info, privacy policy, etc...</div>
        </div>
    </div>
    <script type="text/javascript" language="javascript">
         j_doBar();
    </script>
</body>

栏的CSS为https://kscserver.com/ERP-API/Style/includes.css。条形校正的特定javascript。

//This controls the scrolling of the bar
function j_FixBarSlowly(){
var nTop = 0;
var nLeft = 0;

nTop = (document.body.scrollTop + document.body.clientHeight) - 67;
nLeft = document.body.scrollLeft;

//document.title = document.body.scrollTop + '+' + document.body.clientHeight + '-67' + '=' + nTop + 'px';
document.getElementById("j_protectorite").style.Top = nTop + 'px';
document.getElementById("j_protectorite").style.Left = nLeft + 'px';
document.getElementById("j_protectorite").style.Bottom = '';
document.getElementById("j_protectorite").style.Position = 'absolute';

//Ie6,7,8 hack to force redraw

}

function j_doBar() {
//j_FixBarSlowly();

//if (setInterval != undefined) {
//  setTimeout("j_doBar();",5);
//} else {
    setInterval("j_FixBarSlowly();",5);
//}
}

Answer 1

我建议使用IE修复黑客，例如Dean Edwards' IE7.js。

当您的页面在IE中加载并修复旧版IE中的一些常见问题时，此脚本会运行。 The documentation列出了它处理的内容，并包含position:fixed;。

希望有所帮助。

（当然，最好的解决方案 - 为了您的理智 - 只是放弃尝试让IE6看起来与新浏览器相同，只是在IE6中使用非粘性页脚。只要它不影响可用性，我没有看到IE6用户的页面布局略微不完善的问题。但我知道有些人没有这样做的奢侈;如果你的用户要求它，他们就是你需要的那些听，不是我！）

Answer 2

经过进一步测试后，最佳解决方案是使用I Frame作为页面内容，并在页面内容的底部使用div。当然，一些javascript调整适当的大小调整，你有一个完美的解决方案。

仅供参考。

alt text

如何在IE 6,7,8中保留页面底部的栏，或者如何强制IE重绘界面？

2 个答案: