背景图片显示在 chrome 但没有其他浏览器

Question

我有一个问题，我的背景图片只在 Chrome 上显示，但在 Firefox 或 Edge 上不显示。

我想做的是每次加载页面时都有不同的背景图片。

$(document).ready(function() {
  var totalBGs = 5;
  var rnd = Math.floor(Math.random() * totalBGs);
  
  $(".main").css({
    backgroundImage: "url(../img/img_" + rnd + ".jpg)"
  });
});

.main {
  background-image: url("../img/img_0.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  margin-top: 5rem;
  flex-direction: column;
  align-items: center;
}

Answer 1

首先感谢大家的帮助，我刚刚灵机一动，解决了这个问题。仍然不知道为什么它在 Chrome 上工作，但现在设法使其在其他浏览器上正常工作。 我做了什么：

1. 添加了“风格=”background-image：url(''); " 作为我的 html 对象的内联样式。
2. 将 js 函数的 url 更改为 = img/img_" + rnd + ".jpg 。因为它来自 html 文件。我以前的 url 基本上是在项目文件夹外寻找图像。

再次感谢所有试图提供帮助的人。