jQuery: Backstretch with Blurjs

jQuery: Backstretch with Blurjs

本文关键字:Blurjs with Backstretch jQuery      更新时间:2023-09-26

我正在使用Backstretch来显示我的背景图像。然后我想使用blur .js让元素模糊背景。在反向拉伸的图像上使用blur.js不起作用。我想这是因为Blur.js使用了CSS属性background-image,而Backstretch只是用。

显示图像。

我如何使这两个兼容?这些插件内部的代码相当复杂。

这可能会做你需要的(不使用blurs .js)。只是给backstretch创建的div添加一些CSS模糊。

<style>
    div.backstretch {
      -webkit-filter: blur(5px);
      -moz-filter: blur(5px);
      -o-filter: blur(5px);
      -ms-filter: blur(5px);
      filter: blur(5px);
      margin: -10px; /* Added to get rid of white blur borders */
    }
</style>