使用cropperjs缩放/拖动图片后出现重影线条问题求助

我在用cropperjs实现图片缩放功能时，拖动图片会留下重影线条，当前使用的CSS样式如下：

cropper img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
}

可以尝试以下几种方案解决：

• 给图片添加像素化渲染属性，强制浏览器采用清晰的渲染逻辑，避免拖动时的模糊残留：

cropper img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    image-rendering: pixelated; /* 或者 image-rendering: crisp-edges; */
}

• 禁用硬件加速优化渲染（部分浏览器硬件加速会导致异常重影）：

cropper img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    backface-visibility: hidden;
    transform: translateZ(0);
}

• 确保cropper容器设置了overflow: hidden，防止图片拖动超出容器范围产生渲染残留：

cropper {
    overflow: hidden;
}
cropper img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
}

• 更新cropperjs到最新版本，旧版本可能存在已知的渲染bug：

npm update cropperjs

内容的提问来源于stack exchange，提问作者Hammad Asif