Grow your CSS skills. Land your dream job.

jQuery Accordion IE issues

  • # April 22, 2009 at 3:34 pm

    OK so I’m very new to jQuery and Javascript in general. I can’t write code from scratch, but I’m pretty good at figuring out what’s what and where things go, and generally making things work.

    I am working on my company’s website, which is an older site built on .NET, which I also know little to nothing about, besides the fact that it’s pretty much always a pain to work with… :roll:

    I found the http://docs.jquery.com/UI/Accordion plugin, which looked like a great solution to a page I wanted to redesign. After some trial and error I managed to get a simple working example up on our site: http://www.easycareinc.com/other_products/boot_accessories_new04092.aspx

    Everything looks pretty decent in Firefox, except I couldn’t seem to get the autoheight set to false…but that’s another issue. The bigger problem is that when I fire up IE the sliding animation for showing/hiding the different items becomes totally sucktastic. It’s all jumpy and weird…pretty much unusable. I’ve tried disabling the stylesheet that’s specific to the accordion, but that doesn’t help the problem at all.

    I’m wondering if it’s because our site triggers quirks mode by default…? I know for a fact that it does, but I don’t even know if there’s a way around that. For one thing I haven’t been able to figure out where the doctype for the pages is even served up from (hooray for .net). But if I did manage change the doctype, wouldn’t that screw things up if the code wasn’t valid? Not sure exaclty how that all works.

    In the end the whole site is big, bloated, and and full of nasty old tables and stuff created with a crappy content editor, probably chock full very non-standard, non-validating, nightmarish code. :o I didn’t build it, and can’t tear it down and start from scratch, but a big part of my job is to figure out how to make it look prettier…at least I have some job security there! :roll:

    Anyway, just checking to see if there are any ideas why good old IE has to screw this one up, too, and if there is any way around it in my case. Thanks for reading this far!

    # April 22, 2009 at 7:04 pm

    OK, update time:
    IE quirks mode is the culprit, as far as I can tell.

    I put a couple of straight .html test pages up outside of the nasty .net framework,
    one with
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > doctype:
    http://www.easycareinc.com/boot_accessories_new04092_trans.html
    and the other with
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt; doctype:
    http://www.easycareinc.com/boot_accessories_new04092.html

    And guess what? The one with the strict doctype looks good in IE, the one with the transitional/quirks mode one looks like caca.

    So there you have it. IE quirks mode strikes again! :o

    Now it’s time to figure out if I can even have a standards-compliant page on this blasted website. :roll:

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".