Question

I have just uploaded my first ‘website’ (html+js) to a web server, and my images that are loaded via JavaScript are suddenly broken. (They worked on my local computer.)

I used relative paths (no path at all, since the images are in the same folder as .html and .js files). Static images that are encoded directly in html file are showing, but those loaded dynamically, via JavaScript do not show up. Any ideas why?

---

Sorry, I thought this could be something general, independent of JS. My very simplified piece of code for showing images:

$("#show_image").click(function(){
            $('#test1').append('<img src="a.jpg">');
        });

‘show_image’ is a button, #test1 is a div

Answer 1

In case anyone has similar problem, I’ve found the bug in my solution, it wasn’t easy to find.

The server I used has CASE SENSITIVE file system, and my image’s real file names were e.g. “a.JPG”, instead of “a.jpg” as in code! Of course, this wasn’t a problem on my local, case-insesitive file system, only on server.

I had no idea that server file systems could be case sensitive, now I know… 🙂