javascript - blur.js 试图请求 "none"并且 div 未扩展 100%

Question

我正在尝试使用 http://blurjs.com/模糊我们的标题栏标题图像的 BG。然而，它给了我一个有趣的错误，我似乎无法追踪。这可能与主要代码和兼容性有关，但我不确定。

http://jordan.rave5.com/tmp/

错误是

Failed to load resource: the server responded with a status of 404 (Not Found) http://jordan.rave5.com/tmp/none

此外，当内容框较小且页面首次初始化加载时，背景渐变 div 无法扩展 100%。我已经尝试在其中添加另一个 div 以 100% 或更大的比例将其推出，但当内容区域扩展时，它最终只会将页脚进一步向下推。有点烦人。

Answer 1

您的代码在 blurjs.js 的第 285 行失败。这是因为 blurjs 正在寻找您作为 source(第 202 行)传入的元素的 css 属性。您正在将 .header-img (图像元素)设置为源选项，因此 blurjs 无法在其上找到 background-image 属性，因此默认值为返回 css 属性，none，因此当您尝试加载具有该值的图像时会出现错误。在第 202 行更改 blurjs.js:

var formattedSource;
if($source.is('img'))
    formattedSource = $source.attr('src');
else
    formattedSource = ($source.css('backgroundImage')).replace(/"/g, "").replace(/url\(|\)$/ig, "");