Resolved Gradual fader Mozilla Firefox Problem [Archive]

iskous

05-23-2014, 12:38 PM

1) Script Title: Gradual fader Mozilla Firefox Problem

2) Script URL (on DD): http://hollandrodendaily.net/ (Please take a look with latest version of Mozilla Firefox, or here is a image: http://i.imgbox.com/Bk4YQYKc.jpg

3) Describe problem: I coded this layout and used gradual fader in Google it works pefectly but when I open the site it Mozilla it shows me this: http://i.imgbox.com/Bk4YQYKc.jpg

Thank you in advance.

jscheuer1

05-23-2014, 03:01 PM

It's not the script. If one removes the script from the page, there's still the same problem. If one disables all javascript, there's still the same problem. If one sets the display value of all the gradulafader images to none, there's still the same problem. Try not to use so many tables.

I did notice that if one were to turn everything back on, including this script and reload the page, in Fx, for a brief moment it looked right. So I tried something. While it was looking OK, I hit the stop button. Then, using a 3rd party utility, I did a capture of the source code as currently seen by the browser (the generated or DOM source). I then saved that to a file. That page looked right. Only thing I noticed is that the layout was a little different.

I then started to replace things from the 'working' version to the nonworking version. At the very beginning lay the answer. Removing the DOCTYPE fixed it in Fx without hurting Chrome. Using a text only editor like NotePad, remove:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

from the top of the page's source code.

An alternative might be to validate to that DOCTYPE. I did notice that some of the html looked invalid, but I'm not sure of that, or if fixing it if it is invalid would allow the page to look good in Fx with that DOCTYPE. But if you want to have a standards invoking DOCTYPE, something(s) will need to be changed to make it work in Fx.

Essentially the table slices use quirks mode height and width attributes for tables and table cells. One or more of these and/or other things about the page are invalid with the DOCTYPE you used for the page. Other browsers still accept the invalid code. Fx apparently does not. Removing the DOCTYPE throws the page back into quirks mode. After that, Fx renders as expected. Converting quirks mode table slices to valid standards mode code can be done, but it can be a lot of work. Better to start out with standard code. If you can find a table slicer that outputs valid standard code, use that. Or use something besides table slices, or settle for quirks mode.