Magento Nav Menu in IE7 & 8

This is one of those gotchas that make a developer’s life very difficult. It’s a Magento site I’m working on at the moment, I’ve taken it over from another developer who got in a bit of a fankle with it.

After doing a few days work I realise during final testing that the navigation menu no longer works in IE7 nd IE8. The hover states don’t work, the drop downs don’t appear. As I’d restyled the site, and the navigation menu, I naturally assume I’ve made some mistake with the CSS and spend some time working through it to establish what I’ve done. Couldn’t find anything so loaded in CSS from a Magento site which I knew worked. It didn’t work in IE7 or IE8.

OK, so what else could it be?. Well to cut a long boring story down to a short boring story it turned out that I needed to downgrade the version of the JQuery library that I’d implemented. I’ve no idea why, I’ve wasted far too long on it already, but downgrading from JQuery version 1.6.4 to version 1.4.2 solved the issue.

EDIT: It solved this issue but created another one. The site also had NivoSlider on it, but NivoSlider won’t work in IE9 using Jquery version 1.4.2 – changing to Jquery 1.4.4 solves that issue.

I hope this helps someone!

Leave a Comment