javascript - 试图找到一个 CSS 或 javascript 脚本自动模糊/变黑图像，直到悬停或点击

Question

试图找到一个 CSS 或 javascript 脚本来自动使图像变黑或只是模糊，直到悬停或单击不和谐。

标签： javascriptcss

Answer 1

这行得通吗？只是一个简单的CSS解决方案。

这是片段：

img {
  filter: blur(5px) brightness(60%);
  height: 100px;
  width: 100px;
  transition: 0.5s filter ease;
}

img:hover {
  filter: none;
}

<img src="https://static.vecteezy.com/system/resources/previews/000/101/253/non_2x/vector-free-abstract-background-1.jpg" alt="abstract image" />