如何显示鼠标悬停的模糊图像的部分(小部分)?目前它模糊整个图像,但我想要显示鼠标指向的模糊图像的部分.
HTML
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Anoop</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="blur pic">
<img src="adv_logo.png" alt="plane">
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
CSS
.blur img {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.blur img:hover {
-webkit-filter: blur(1px);
}
Run Code Online (Sandbox Code Playgroud)