Sim*_*lGy 8 javascript css internet-explorer internet-explorer-7
我这里有一个有趣的问题.我在元素上使用一个类作为开关来驱动我网站上的大量布局行为.
如果应用了类,则会发生某些事情,如果未应用该类,则不会发生这种情况.Javascript用于应用和删除类.相关的CSS大致如下:
.rightSide { display:none; }
.showCommentsRight .rightSide { display:block; width:50%; }
.showCommentsRight .leftSide { display:block; width:50%; }
和HTML:
<body class="showCommentsRight">
<div class="container"></div>
<div class="leftSide"></div>
<div class="rightSide"></div>
</div>
<div class="container"></div>
<div class="leftSide"></div>
<div class="rightSide"></div>
</div>
<div class="container"></div>
<div class="leftSide"></div>
<div class="rightSide"></div>
</div>
</body>
我简化了一些事情,但这基本上就是方法.当在主体上设置标志时,整个页面改变布局(在三个不同区域中隐藏右侧).这适用于Firefox和IE8.它在兼容模式下在IE8中不起作用.令人着迷的是,如果你坐在那里刷新页面,结果会有所不同.它将选择一个不同部分的右侧来显示.有时它只显示顶部的右侧,有时它会显示中间.
我试过:
- 验证器(寻找格式错误的HTML)
- 双重检查我的CSS格式,并...
- 确保我的IE7黑客表没有效果.
- 将标志类放在不同的非主体包装元素上(仍具有相同的奇怪行为)
所以我的问题是:
- 有没有办法让这种行为变得可靠？
- IE7什么时候决定重新造型？
感谢大家.
听起来有点像我在 ie7 中遇到的问题，其中 DOM 已更新，但屏幕上的像素没有更新（有时将鼠标悬停在其上会触发重绘）。我发现了一个适用于我的情况的肮脏黑客（spesudo-javascript）：
//Just after changing the css class:
if(isIe7()){
addAnEmptyDivAboveTheChangedElement();
removeTheEmptyDivFromTheDom();
}
由于某种原因，这种添加和删除元素的残酷黑客行为（如果您在任何地方添加和删除它甚至可能会起作用）会导致 ie7 重新绘制文档。不过，它可能会导致闪烁，而且这是一种昂贵的黑客行为，因为它会强制在已经很慢的浏览器中进行完全重新绘制，这就是为什么我只有在确定它是 ie7 时才会这样做（不要仅仅因为 ie7 很愚蠢而减慢所有其他浏览器的速度）。
不过，不能保证它会起作用......当我试图找到解决我的问题的方法时，我发现很多不同的技巧都不起作用。修复 ie7 与 javascript 的不一致问题几乎需要不断的尝试和错误。:)
PS：我看到display已经建议进行切换，它可能有效，或者就像我的情况一样，它没有。我实际上必须从 dom 树中删除该元素才能使其工作。