Javascript 在谷歌浏览器中缩小时显示错误

我的网页缩放有问题。我绑定了鼠标滚轮，用鼠标动态缩放。带背景的主要元素约为4000px。以下是屏幕截图，它看起来是什么样子：

当我想缩小，看到一个完整的元素，一切都是混乱的上下文菜单消失，背景图像丢失。。。。以下是缩小屏幕的截图：

这是实际元素上的CSS：

element.style {
  position: absolute;
  -webkit-transform-style: preserve-3d;
  -webkit-transform: translate(-50%, -50%) translate3d(3145px, 1463.6364px, 0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(5) scaleY(5) scaleZ(1);
  width: 1437.5561545372866px;
  height: 800px;
  cursor: inherit;
}
.bg-slide {
  background-color: transparent!important;
  background-image: none!important;
  z-index: -2;
  border: 0!important;
}

这一定是chrome的问题，但我不知道在哪里，因为它在firefox中运行良好，来自ff的屏幕截图：

---

控制台有输出吗？没有，控制台完全是空的。你是为大屏幕设计的吗？我不确定你的意思。我想你错过了没有前缀的东西：变换样式和变换。。。还是应该带前缀的？