1

我有投资组合网站，我需要做以下事情：

  1. 我需要<div>停靠在页面的左侧，其行为类似于“磨砂玻璃”（请参阅​​ http://clip2net.com/clip/m30443/1376076885-clip-147kb.png）

  2. 为了更好地理解我想要的内容，请参阅http://themespectrum.com/scroll-demo：您可能会看到半透明的左侧菜单边栏。我还需要使该侧边栏类似于“磨砂玻璃”，这样在其下方滑动的图像将在该侧边栏区域内模糊。

模糊 = 高斯模糊

我尝试了一切：SVG过滤器，webkit的东西，不同的js，jquery，但他们并没有完全按照我的意愿做:(他们只是对图像或div应用一次模糊效果。但我需要的是不断地做，而一个是滚动图像。

4

2 回答 2

4

Blur.js 可能是您正在寻找的！

http://blurjs.com/

它也适用于移动 DIV，满足您的预设！

看一下可拖动的例子

$('.target').blurjs({
    draggable: true,
    overlay: 'rgba(255,255,255,0.4)'
});
于 2013-08-09T19:51:36.070 回答
0

blurjs 只复制模糊 div 内需要模糊的背景。因此，在这种情况下，可以使用 CSS 和 HTML 来完成，因为它实际上是这样做的。看看这里

blurjs 和我刚刚给您的解决方案的问题是，您将无法模糊不断变化的背景，例如幻灯片。当你只需要它是“可滚动的”时它就会起作用，你只需要固定你的背景。

于 2014-06-17T18:15:09.753 回答