如何使用壁纸引擎的网页壁纸中的用户属性将自定义图像设置为body元素的背景图像？

Question

body {background-image: url('wallpaper.jpg'); background-size: cover;}

window.wallpaperPropertyListener = {
            applyUserProperties: function(properties) {
                 if (properties.customimage) {
                    var customImageFile = 'file:///' + properties.customimage.value;
                    document.body.style.backgroundImage = `url('${customImageFile}')`;
                }        
            },
        };

如果我设置为 img src 而不是背景图像，这会起作用。 当我将图像导入到用户属性时，没有任何变化。但是当我删除它时，背景图像（默认图像）消失了。

Answer 1

对于

file:///

协议，您应该将文件路径中的反斜杠替换为正斜杠。

body {
  background-size: cover;
}

window.wallpaperPropertyListener = {
  applyUserProperties: function (properties) {
    if (properties.customimage) {
      var customImageFile = 'file:///' + properties.customimage.value.replace(/\\/g, '/');
      document.body.style.backgroundImage = `url('${customImageFile}')`;
    }
  },
};