更改DIV大小与更改其BG大小（性能）

Question

所以，例如我有一个div，我需要放大鼠标悬停。 我知道有两种方法可以做到：

• a）实际放大DIV
• b）因为我听说过JS操作 DOM是它的主要问题，在我看来，我们可以创建2 DIV，1表示放大尺寸，2表示最小化，BG尺寸为 放大等于最小化DIV的大小，例如70％

最小化DIV mouseenter - 触发功能，将bg大小设置为放大DIV大小的100％

Scheme here：边界DIV - 代表放大的DIV，具有70％的BG尺寸;最小化的div具有零不透明度，大小适合精确成像

TL; DR

那么哪种方法更快：使用DIV的大小本身，或使用其css属性进行操作？希望我能清楚地描述我的想法。

Answer 1

浏览器最高效的方式通常是通过css转换来创建更大的东西，因为它的硬件加速并且根本不与DOM的定位冲突。它也是制作动画的最简单方法：）

演示：https://jsfiddle.net/v0k69mq3/

HTML：

<div>foo</div>

的CSS：

div:hover {
  transform:scale(1.5)
}