背景以Firefox中的变换3D和滤镜模糊为中心

2018-06-13 19:39:21

inb4：对于可怕的超大图片需要超长时间加载，请点击链接并在之后阅读问题，如果您不想等待！

所以我正在制作一个网站的原型，在这个网站中，我用2D鼠标移动2D图像来制作假3D效果。我想在用户点击其中一个三角形时突出显示滤镜模糊效果。

我的问题是，当我添加模糊时，它完全在Firefox中打破。我没有问题，但在Chrome浏览器的模糊，但由于某种原因在Firefox中，应该居中的背景图像被右对齐，并由它自己的div裁剪，如果我在检查器中更改背景位置，它将移出车的区域。

这里是Chrome浏览器的屏幕截图，其次是我在Firefox中获得的内容。

在Chrome中没有问题 Firefox中怪异的错误

在放弃整个模糊想法之前，我并不完全确定要做什么。 任何解决方案的想法都是有好处的

所以我必须完全设置为0旋转XY和Z，然后才能通过javascript更改父级滤镜模糊设置（仅当检测到Firefox时）。以下是它现在的样子。点击动画的GIf模糊，然后点击任何地方以消除模糊。适用于Chrome和Firefox！

它基本上是这样工作的：

var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
if(!isFirefox){
  3Danimation();
}

链接地址: http://www.djcxy.com/p/39385.html