小编sch*_*zel的帖子

原因:在大量DOM元素的webkit浏览器中,悬停是如此之慢

当有许多DOM加载了javascript元素时,使用:hover伪类(如长表),Chrome和Safari中的效果会变得缓慢/滞后.Firefox似乎处理大量行:与webkit相比,hover相当快.

例如,您可以通过使用:悬停效果生成10,000行来查看差异. http://jsfiddle.net/jschin/VwmjT/

var table = document.createElement('table');

for (var i=0; i<10000; i++) {
    var r = document.createElement('tr');

    for (var j=0; j<3; j++) {
        var c = document.createElement('td');
        c.appendChild(document.createTextNode(i*j));
        r.appendChild(c);
    }

    table.appendChild(r);
}

document.getElementById('b').appendChild(table);
Run Code Online (Sandbox Code Playgroud)

我知道10,000行是一个坏主意.我知道你应该分页.我只是好奇为什么会这样.

css performance webkit hover

6
推荐指数
1
解决办法
2527
查看次数

标签 统计

css ×1

hover ×1

performance ×1

webkit ×1