Fatal编程技术网
  • javascript/
  • Javascript 在IE 6、7、8中，如何在页面底部保留一个条，或者如何强制IE重新绘制界面？

Javascript 在IE 6、7、8中，如何在页面底部保留一个条，或者如何强制IE重新绘制界面？

javascript internet-explorer-8

Javascript 在IE 6、7、8中，如何在页面底部保留一个条，或者如何强制IE重新绘制界面？,javascript,internet-explorer-8,internet-explorer-7,internet-explorer-6,Javascript,Internet Explorer 8,Internet Explorer 7,Internet Explorer 6,我需要在web浏览器的客户端视图的底部粘贴一个条。传统上我会使用位置：固定；除了我需要支持我的IE 6客户。我有一个非常广泛的技巧，可以将条粘到页面底部和内容上，但是当用户向下或向右滚动时，条会固定在页面上 为了纠正这个问题，我使用了一个javascript事件，该事件使用setInterval触发，当在IE（8）的调试工具中运行该函数时，该事件会触发并更改position top和position left属性，但页面不会重新绘制元素。代码可以工作，但元素没有移动，请参见下文 正如你所知，修

我需要在web浏览器的客户端视图的底部粘贴一个条。传统上我会使用位置：固定；除了我需要支持我的IE 6客户。我有一个非常广泛的技巧，可以将条粘到页面底部和内容上，但是当用户向下或向右滚动时，条会固定在页面上

为了纠正这个问题，我使用了一个javascript事件，该事件使用setInterval触发，当在IE（8）的调试工具中运行该函数时，该事件会触发并更改position top和position left属性，但页面不会重新绘制元素。代码可以工作，但元素没有移动，请参见下文

正如你所知，修复必须在IE怪癖模式下工作。。。如果其他IE版本试图使用一个标准，它就无法工作。相信我，我已经试过了

另外，这真的很让人恼火，因为我也在反复检查IE9的支持情况。。。在IE 6、7和8中，元素不随滚动条移动，但在IE 9中移动，它仍然显示“IE怪癖模式”。微软表示，该版本不会产生任何影响

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>
我建议使用IE补丁，比如

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

希望有帮助


（当然，为了你的理智，最好的解决方案就是放弃让IE6看起来与新浏览器完全相同的尝试，在IE6中使用无粘性的页脚。只要不影响可用性，我认为IE6用户的页面布局稍微不那么完美没有什么问题。但我知道有些人没有这样做的奢侈；如果你的用户要求这样做，你必须听的是他们，而不是我！）
我建议使用IE补丁，比如

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

希望有帮助


（当然，为了你的理智，最好的解决方案就是放弃让IE6看起来与新浏览器完全相同的尝试，在IE6中使用无粘性的页脚。只要不影响可用性，我认为IE6用户的页面布局稍微不那么完美没有什么问题。但我知道有些人没有这样做的奢侈；如果你的用户要求这样做，他们是你必须听的人，而不是我！）
进一步测试后，最好的解决方案是对页面内容使用一个I框架，并在页面内容的底部有一个div。当然，对javascript进行一些适当的调整，你就有了一个完美的解决方案

仅供参考


进一步测试后，最好的解决方案是对页面内容使用I框架，并在页面内容的底部添加div。当然，对javascript进行了一些调整，以获得适当的大小，您就有了一个完美的解决方案

仅供参考


如果您的浏览器处于怪癖模式，您可能需要将
添加到页面顶部（如果您没有doctype，难怪您会遇到浏览器兼容性问题）.我个人的最爱：Un-IE6他们：邪恶的天才！如果你的浏览器处于怪癖模式，你可能需要在页面顶部添加
（如果你没有doctype，难怪你会遇到浏览器兼容性问题）.我个人最喜欢的：Un-IE6他们：邪恶的天才！不幸的是，除非我能从JS库中取出位置：修复补丁，否则我无法使用它。它会让很多工作正常的东西感到不安。为了回答你的说法，大约50%（可能更少）我们的大多数客户在旧XP机器上使用IE6。我们陷入困境。另一个非常重要的注意事项是，由于IE6的支持，该应用程序只能在IE怪癖模式下正常工作。即使IE6在标准模式下使用doctype也更好。（当然，它仍然有很多问题，但总比没有好）我转向了iframe解决方案，这不是最好的主意，但它确实起到了作用。它还使控制页面缩放变得更加容易。谢谢你的帮助，就像我说的，在正常情况下，我更喜欢使用doctype和position:fixed。不幸的是，除非我能从JS库中取出position:fixed，否则我无法使用它。这会让我感到不安很多事情都运行良好。为了回答您的说法，我们大约有50%（可能更少）的客户在旧XP机器上使用IE6。我们陷入困境。另一个非常重要的注意事项是，由于IE6的支持，该应用程序仅在IE怪癖模式下工作良好。甚至IE6在带有doctype的标准模式下也更好。（当然，它仍然有很多问题，但总比没有好）我转向了一个iframe解决方案，这不是最好的主意，但它确实做到了。它还使控制页面缩放变得更容易。谢谢你的帮助，就像我说的，在正常情况下，我更喜欢使用doctype和position:fixed。

//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);
//}
}