在dropzone.js中移除悬停在图像预览顶部时的模糊效果

Question

我使用的是dropzone.js，当我将鼠标悬停在上传的图片预览上时，我想消除模糊效果。

您可以在示例中从dropzone的主页直接在网站上观察到此行为。https://www.dropzonejs.com/

谢谢你们！

Answer 1

找到了！

我们需要覆盖这个类：

.dropzone .dz-preview:hover .dz-image img {
  -webkit-transform: scale(1.05, 1.05);
  -moz-transform: scale(1.05, 1.05);
  -ms-transform: scale(1.05, 1.05);
  -o-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
  -webkit-filter: blur(8px);
  filter: blur(8px); }

Changing -webkit- filter: none；filter: none；

谢谢

Answer 2

尝试使用检查器并检查它为您提供的效果的类，我认为它被称为dz-preview或dz-details，并根据您的喜好更改css或通过注释它来移除悬停效果。

Answer 3

你可以这样做

.dropzone .dz-preview:hover .dz-image img {
      -webkit-transform: scale(1.05, 1.05);
      -moz-transform: scale(1.05, 1.05);
      -ms-transform: scale(1.05, 1.05);
      -o-transform: scale(1.05, 1.05);
      transform: scale(1.05, 1.05);
      -webkit-filter: blur(8px);
      filter: blur(0px);
    }