Wondering if anyone could offer some suggestion, as I've spent a very long time fruitlessly searching for possible reasons and/or solutions to a problem.
I've made a new photo gallery page on which all the images are linked from blank spacer gifs lined up across the page. A mouseover loads each image into a designated area on screen, after which the image (via JS functions) fades out.
Apart from a scrolling issue, everything works wonderfully on my Mac using Firefox, but I'm having serious cross-browser problems. Both Safari and Opera are non-functional. There are no external style sheets etc, the page is self-contained. I haven't yet tested on IE as I'm working on a Mac and have no Windows access at present. Perhaps someone could advise on any IE problems that exist.
For cross-browser compatibility I have statements:
setOpacity: function(obj, opacity)
obj.style.filter = "alpha(opacity=" + opacity + ")"; // For IE filter to work, obj MUST have layout
obj.style.KHTMLOpacity = opacity / 100; // Safari and Konqueror
obj.style.MozOpacity = opacity / 100; // Old Mozilla and Firefox
obj.style.opacity = opacity / 100; // CSS3 opacity for browsers that support it
but obviously something's not right there.
All the CSS validates, although the HTML gives a few messages which don't make any sense to me as it seems to be pointing out standard syntax in some if..else statements as errors. However as I said the page functions fine in Firefox.
The page is at: http://moonmilk.org/test/fadelinkline.htm
Any suggestions would be gratefully appreciated.
By the way, my reasons for not displaying thumbnails and for preventing wrapping is purely aesthetic....the Firefox scrolling issue which arises from this I'm sure is a problem with overflow statements although I haven't yet been able to isolate it.
Thanks very much in advance for any help anyone might be able to offer.