关于重绘和回流

  z-index可以对应的元素被重绘(repaint)。

   关于重绘(repaint)和回流(reflow)的知识:

 1. 添加、删除元素(回流+重绘)
    2. 隐藏元素,display:none(回流+重绘),visibility:hidden(只重绘,不回流)
    3. 移动元素,比如改变top,left(jquery的animate方法就是,改变top,left不一定会影响回流),或者移动元素到另外1个父元素中。(重绘+回流)
    4. 对style的操作(对不同的属性操作,影响不一样)
    5. 还有一种是用户的操作,比如改变浏览器大小,改变浏览器的字体大小等(回流+重绘)
    让我们看看下面的代码是如何影响回流和重绘的:  
var s = document.body.style; 
s.padding = "2px"; // 回流+重绘
s.border = "1px solid red"; // 再一次 回流+重绘
s.color = "blue"; // 再一次重绘
s.backgroundColor = "#ccc"; // 再一次 重绘
s.fontSize = "14px"; // 再一次 回流+重绘
// 添加node,再一次 回流+重绘
posted @ 2016-08-04 11:23  薄小冰  阅读(195)  评论(0编辑  收藏  举报