我的网站上有一些图像相互堆叠（相对 DIV 中的绝对定位）。我喜欢在 mousemove 事件时切换这些图像。我通过添加/删除 CSS 类进行了尝试。到目前为止，这有效。但是，在 Chromes 时间轴中，我看到了相当长的重绘，包括每个事件的“图像解码”和“图像调整大小”。我尝试了不同的“隐藏技术”，如“display:none”、“visibility:hidden”和“z-Index:0”。切换显示或可见性并没有什么不同，但是 zIndex 版本花了很长时间，因为每张图像都会重新绘制。所以我被困在这里。如何在不重绘的情况下切换可见性？至少不需要图像解码？！这是我在 JS 中如何做的代码片段：
var currentImgElem = document.getElementById(elem_id_curr);
var showImgElem = document.getElementById(elem_id_show);
currentImgElem.classList.add("hide");
showImgElem.classList.remove("hide");
而“隐藏”是以下之一：
display:none;
visibility:hidden;
z-Index:0;
还有一个困惑：当我在画布上绘制图像时，一切都很好！