javascript - 强制 IE 到 'redraw' 一个带有 JavaScript 的元素来修复 CSS 错误?

标签 javascript internet-explorer

我遇到了 IE 错误。 CSS counter 属性在 IE9 中不适用于在页面加载时隐藏的元素(例如选项卡)。

css counter not working in internet explorer for hidden content - how to fix?

正如我在上面发布的那样,我已经能够通过使用 JavaScript 设置一些内联 CSS 来解决这个问题。当它未隐藏时,我将 padding-left 设置为 0(即使该元素已经没有左填充)。这会使 IE“重绘”元素,然后正确应用 CSS。

但这不是理想的解决方案。如果设计更改为在元素上留有填充,那么我的 JavaScript 修复将破坏布局。我还可以使用什么其他方法让 IE“重绘”元素?有没有标准的方法来做到这一点?

最佳答案

Paul Irish 为您编制了一份 list

What forces layout / reflow. The comprehensive list.

All of [the properties or methods found at this link], when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

我不想在这里发布整个列表以避免剽窃,因为我基本上没有向答案添加任何内容;我只是向您指出它。

但是,我要说的是,虽然 Paul Irish 警告说使用这些是“常见的性能瓶颈”,但可以在需要时战略性地使用它们来强制回流。这在特定于浏览器的场景中特别有用。

如果您想将回流限制为仅 IE9,您需要将布局抖动调用包装在 feature detection check 中。 .

关于javascript - 强制 IE 到 'redraw' 一个带有 JavaScript 的元素来修复 CSS 错误?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33106193/

相关文章:

javascript - 如何检查一个数组中的某个项是否存在于另一个数组中?

javascript - Asp.net MVC 根据值检查/取消选中复选框?

css - 为什么背景图像在 ^IE9 上不重复

internet-explorer - IE9酸3测试?

html - 在 TD 内创建高度为 100% 的 div

html - 为什么 IE 对待我的 png 图像的方式与其他浏览器不同?

javascript - 如何检索 HTML DOM 中的所有文本但排除 SCRIPT 和 STYLE 标记?

javascript - 在无限循环中运行函数

javascript - AngularJS 中的警报计时器值

javascript - 为IE6/其他浏览器运行不同的JS