Jquery Accordion issues on IE

Posted on 2010-11-08
Medium Priority
Last Modified: 2012-05-10
I have used the jquery UI to build a simple accordion for the Tools on this page: http://www.africanhealthleadership.org/resources/toolkit/

Everything works fine on Firefox, but things are weird on IE7.  When someone clicks on one of the accordion elements, the line/arrow above the previously clicked accordion element disappears.  

The line/arrow will reappear on mouseover, but something seems to be overwriting the stylesheet information.

Also on IE, I am getting unwanted scrollbars on the first item (Preparation) after a user clicks on a different part of the accordion.  

I have tried all sorts of ideas but with no luck.

Thank you for any help!
Question by:rjunk
  • 3
  • 2
LVL 43

Expert Comment

ID: 34089961
Please check and correct the errors in your page as it's more than possible that's what is causing your problems:


Author Comment

ID: 34093300
Thanks Tagit, I resolved the big ones that applied to the accordion. I will clear up the others before launch, but the problem still persists and I don't suspect that it is tied to those unresolved items.  Any ideas are appreciated, thank you.
LVL 43

Expert Comment

ID: 34097382
I'm just looking at your code in your main page and all your javascript comments only have 1 slash.  This will definitely be causing unpredictable results.  I would suggest testing with Firefox and download an add-on called Firebug.  it shows you all js and dom errors


                  ); / end hover
            }); / end each
      }); / end ready()
7 new features that'll make your work life better

It’s our mission to create a product that solves the huge challenges you face at work every day. In case you missed it, here are 7 delightful things we've added recently to monday to make it even more awesome.


Expert Comment

ID: 34100863
I verified code, markup is wrong.
p should be children of li not ul
view below code.

<ul class="tools">

<li>Overview of Preparation Tools</li>

<li><p><a href="http://www.africanhealthleadership.org/wp-content/uploads/Special-Education-Paraprofessional-posting.pdf">Programmatic Logic</a></p></li>

<li><p><a href="http://www.africanhealthleadership.org/wp-content/uploads/FinalLogo-tag-line.pdf">Project Management &ndash; test</a></p></li>

Open in new window


Accepted Solution

rjunk earned 0 total points
ID: 34101107
Thanks Tagit and Wasim. I was able to solve by removing the clears and setting overflow to auto on the parent div.  I will go and clean up the validation errors now, thank you for your help.

Author Closing Comment

ID: 34134489
Why a B? I was the goof who put the malfunctioning code in there in the first place, no A for me.

Featured Post

Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this blog, we’ll look at how improvements to Percona XtraDB Cluster improved IST performance.
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
This video shows how to quickly and easily deploy an email signature for all users in Office 365 and prevent it from being added to replies and forwards. (the resulting signature is applied on the server level in Exchange Online) The email signat…

600 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question