• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 612
  • Last Modified:

Suckerfish Menu Issue in IE-8

I'm unable to keep the sub menu open on mouse hover over it. When i hover the mouse over main navigation (http://www.asdha.org/), it pop outs the sub navigation but as soon i bring mouse pointer over any of sub menu items, the sub menu disappears in some while. Can you please let me know any clue for this issue.

To tell you that i'm having this issue only in IE 7, where as in FF there is no such problem.
0
23-degrees
Asked:
23-degrees
  • 2
  • 2
1 Solution
 
mreuringCommented:
My first reaction would be, why still use suckerfish? :hover is supported on all elements in IE7 and IE8. If you want to support IE6 use 'Whatever: hover' instead, it patches the browser using a behaviour to add :hover support to elements based on your existing styles. This way, if it works in other css2 supporting browser, it'll usually work in IE6+

http://www.xs4all.nl/~peterned/csshover.html
0
 
23-degreesAuthor Commented:
Hi, i'm sorry i'm no good at css, so can you please provide me a simple example code/script for what you are referring me to look at the given link. Remind that i need a solution as Cross browser, including atleast, IE5+, FF, Chrome, Netscape.
0
 
mreuringCommented:
The link provided is a stable solution that has been around for years. Your menu seems to work just fine on FF and Chrome using normal CSS :hover rules. Suckerfish is a JavaScripted solution to work around IE5 and 6 not supporting :hover on anything other than a link (<a>-tag), but it requires that you implement a bit of javascript AND that you adjust your CSS rules.
Whatever:hover uses an IE-only technique to insert javascript only in elements that need to be adapted by reading your stylesheet. In essence this is similar to Suckerfish, with the great benefit that you don't have to adapt your own CSS. The link is the developer page with detailed info on how to apply the solution to your website, I quote:
"How do I use it?

Link whatever:hover to the body element, and you're all set. Note that behavior URLs are relative to the html file, not to the CSS file like a background image URL would be.
body { behavior: url("csshover3.htc"); }"

The reason I chose to supply the link is that this way you won't have to rely on another expert to do everything right, you have all the documentation at hand.

I cannot guarantee that it'll work for IE5, I personally barely support IE6 anymore. It 'should' work just fine, but I wouldn't even bet on suckerfish working well in IE5 without extra testing.

0
 
23-degreesAuthor Commented:
Thanks
0

Featured Post

Learn to develop an Android App

Want to increase your earning potential in 2018? Pad your resume with app building experience. Learn how with this hands-on course.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now