如何在将类添加到dom元素后强制ie8重绘

Question

在ie8中,如果元素在更改类名时没有与关联的css"重新绘制",那么如何强制浏览器刷新而不是杀死ie8性能？

这篇文章(我如何强制WebKit重绘/重绘以传播样式更改？)建议调用offsetHeight来强制重绘.

这篇文章(http://www.tek-tips.com/viewthread.cfm?qid=1688809)有一条评论建议在body元素中添加和删除一个类.

这两种方法都杀死了ie8性能,第一种方法对我的布局产生了副作用.

什么是最好的方法？

Answer 1

我为我的ie8问题提出的解决方案是在我正在改变的元素的近父级上添加/删除一个类.因为我正在使用现代化器,所以我检查ie8然后执行此操作添加/删除舞蹈以获得新的css进行绘制.

        $uicontext.addClass('new-ui-look');
        if ($('html').is('.ie8')) {
            // IE8: ui does not repaint when css class changes
            $uicontext.parents('li').addClass('z').removeClass('z');
        }

Answer 2

这个问题的正确答案是你需要真正改变content规则.

.black-element:before { content:"Hey!"; color: #000;}
.red-element:before { content:"Hey! "; color: #f00;}

注意我Hey!打开后添加的额外空间.red-element

Answer 3

可笑的是,这有效:

function ie8Repaint(element) {
    element.html(element.html().replace('>', '>'));
}

DOM中没有任何实际更改,因此它不会影响任何其他浏览器.