jQuery's slideToggle does both slideDown and slideUp in IE8 simultaneously

Question

I've uploaded my problem here : http://gotchance.com/k2/

Try clicking on the "Login" link. It works fine in FF and Safari. However in IE8, the form slides down and then slides up again automatically.

For testing purpose, i added 4 more "test" links and found that only the links inside #navigation div cause this problem.

Also, if i toggle using any other element like "button" "input", it works fine. Only the "a" tags inside the "#navigation" cause the problem.

Any ideas ?

Answer 1

One problem I see is that you have an extra comma in your custom.js file. The extra comma is on line 25.

Before:

   confirm: {
      required: true,
   equalTo: "#rpassword"
  },
 },

After:

confirm: {
   required: true,
   equalTo: "#rpassword"
  }
 },

I don't know if that will solve your problem though.

Answer 2

Your html does not validate. Always make sure you run it through the w3c validator first. An invalid dom can play hell with jquery selectors (especially in ie).

Also I have noticed that the rounded and font plugins produce some odd markup which may also cause issues.

Have you tried stripping the page down to its bare bones then adding the functionality a piece at a time ensuring after every step your toggle is working.