Can this be altered to work on Hover?

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Can this be altered to work on Hover?

Post by simonmlewis »

http://tympanus.net/codrops/2013/03/05/ ... down-menu/
I need to make the menu at the top work on hover AND CLICK. So it can work by the desktop mouse hovering over it, but on mobile, it will work with the tap on the screen.

I can make it work on "mouseover", however the dropdown part disappears when you leave the menu item.

Thanks.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Can this be altered to work on Hover?

Post by Celauran »

simonmlewis wrote:I can make it work on "mouseover", however the dropdown part disappears when you leave the menu item.
Really? Shouldn't do that. Can you post your code (ie. with your modifications)?
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Can this be altered to work on Hover?

Post by simonmlewis »

Actually ignore this one. I've been told they want it to be click, and not hover. Hover ones can be annoying.
Thing is, if you set it to hover, then you have to set it to "mouseout" as well - the moment you do that, the menu that appears, disappears anyway.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: Can this be altered to work on Hover?

Post by Celauran »

simonmlewis wrote:Thing is, if you set it to hover, then you have to set it to "mouseout" as well - the moment you do that, the menu that appears, disappears anyway.
Not really. You can have mouseover toggle visibility so the initial hover switches it on and leaves it on until you hover again to close it.
Post Reply