I built my first site with jQuery and overall it turned out quite well – in most browsers, that is. You can see the site’s test environment here.
Much to my surprise, it works great in IE, Chrome, Safari and Opera – but it pretty much sucks in FireFox. I’m using a basic slideshow, a hand-coded horizontal accordion, some little popup boxes, various little effects, and the jQuery LightBox plugin. All of my code is viewable here.
The biggest and most glaring FireFox problem is the accordion – when it slides, it’s fairly smooth, but there are tons of artifacts. I have actually reduced the visual artifacts from what they were by setting the content that’s hidden to display: none;.
If I am making some noob mistake, please embarrass me and point it out. I am open to just about any suggestions, so long as you don’t tell me I have to change the features – my client is already set on those because my boss promised them (before asking if I could implement them, of course).
It seems that the transparent text boxes (whose movement is causing the artifacts, right?) are entirely within their respective accordion page in IE, but they overlap the page in FF. I have no idea why that is (and no time to look through the code right now) but maybe a “overflow: hidden” in the right place is enough already.