Most of the structure of an HTML document, including the html, head and body elements, can be left
out without invalidating the document. Also, most block-level elements are self-closing. For instance,
the segment <p>Hello<div>World is perfectly equivalent to <p>Hello</p><div>World</div>, which can
sometimes be unintuitive, especially in combination with CSS or the querySelector function.
The problem was image preloading – a common and simple method that I had used several times before:
...but nothing worked. All different options worked perfectly in Internet Explorer and in Opera (a couple of variants didn't
work in IE 5.5), but in Firefox nothing happened – no image was loaded, no matter what I did!
This solution actually worked! But since it has a really bad code smell, I didn't want to use it. It reminded too much about eval().
I Googled like a mad-man and found similar questions on several different forums and discussion groups from people in
the same situation as I, but no answers. Finally I searched for preload images firefox problems, and just happened to stumble upon the Firefox development teams's configuration documentation. For some reason, my browser's value of the dom.disable_image_src_set setting was true – probably made that way by a security plugin that I had installed previously.
When changing the setting from true to false(by first typing about:config in the Firefox address box), preloading images
started working without a glitch in Firefox.