你怎么能强迫linux上的chrome重新计算/重新渲染":hover"造型?

时间:2014-04-29 04:44:12

标签: javascript html css linux google-chrome

我的情况是javascript代码导致DOM /样式更改,这反过来会导致页面呈现不同,因为鼠标下的元素发生了更改。一个简单的例子是:

<style type="text/css">
#one {
    position: relative;
}
#two {
    background-color: green;
    display: none;
}
#one:hover #two {
    display: block;
}
</style>

<script type="text/javascript">
$(window).load(function(){
    $('#one').on('click', function() {
        $('#one').css('left', '100px');
    });
});
</script>

<div id="one">One
    <div id="two">Foo</div>
</div>

点击http://jsfiddle.net/Lq7Ac/1/ - 点击&#34; One&#34;元素移动,以便&#34;:hover&#34;应该不再应用样式,但在点击后移动鼠标之前,它们实际上不会更新。

我可以在&#34;点击&#34;绑定到立即重新计算/重新渲染?

更新:这似乎只影响linux上的chrome。所以可能是chrome中的一个bug。尽管如此,如果有人有解决这个问题的想法,那么听听他们会很棒。

1 个答案:

答案 0 :(得分:0)

可以尝试使用css类,而不是:hover选择器。

http://jsfiddle.net/4tfYN/