浏览器找不到背景图片文件

Question

我正在尝试使用本地文件作为我的背景图片，当我通过我的文本编辑器预览它时它可以工作，但是当我将更改推送到我的 github 页面时，控制台 returns GET http://davez01d.github.io/images/background-1.PNG 404 (Not Found)。这是加载背景图片的脚本 -

var backgroundImages = [
    {url: '../images/background-1.PNG', credit: 'http://www.intrawallpaper.com'},
    {url: '../images/background-2.JPG', credit: 'David Stewart'},
    {url: '../images/background-3.JPG', credit: 'David Stewart'},
    {url: '../images/background-4.GIF', credit: 'http://jecichon.tumblr.com'},
  ];

  $('#hero').css('background-image', 'url(' + backgroundImages[Math.floor(Math.random()*backgroundImages.length)].url + ')');

我的文件结构是这样设置的

-Davez01d.github.io
  -css
    -style.css
   -images
     -background-1.PNG
     -background-2.JPG
     -etc.

Answer 1

您 github 上的文件扩展名是小写的。将 PNG、JPG、GIF 替换为 png、jpg、gif 即可。

浏览器找不到背景图片文件

browser can't find file for background image

javascript

css

jquery

github-pages