javascript - 模糊整个页面 - 鼠标悬停显示内部非模糊的圆圈

标签 javascript jquery css

我已经为我的个人网页制定了这个很酷的想法。

我基本上只是想模糊掉 <body>以及其中的一切。

鼠标悬停时——一个圆圈代替鼠标,内部不模糊。

任何简单的 JS/jQuery 或 CSS 解决方案?

在圆圈内轻松切换缩放会很酷;但没有也行。

(类似于这张照片:http://medialoot.com/images/thumbs/640x440x1_Parallax_Wordpress_Theme_Preview31.jpg)

最佳答案

只是几个想法:

This Fiddle 会按照您的建议进行操作: http://jsfiddle.net/jamygolden/CGFBT/2/light/

您必须修改悬停效果,以便它只会消除鼠标下方的元素的模糊效果。

对于图像,您可以为每张图像制作一个 sprite,其中包含一个模糊且聚焦的版本,当您将鼠标悬停时该版本会翻转。

关于javascript - 模糊整个页面 - 鼠标悬停显示内部非模糊的圆圈,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11228399/

相关文章:

javascript - 更改从上到下的偏移量返回为 null

javascript - 如何使用 jQuery 解析 XML 响应

jquery - 如何检查任何元素是否具有特定属性

html - 如何在一个数据图标声明或 div 中包含多个字体图标

css - 在开发环境中找不到更少的节点模块

css - 模拟 bootstrap @media 查询行为的困难时期

javascript - 如何在另一个 div 内每 X 个 div 添加结束和开始 div 标签?

javascript - Angular排列并保存用户修改的模板

javascript - 制作 JavaScript 按钮选择器

javascript - 如何在显示覆盖的更改事件后捕获点击事件?