HoverIntent in mega menu

Ecommerce design Joomla template to start your online business with VirtueMart and additional eshop features.
GK User
Tue May 24, 2011 9:19 am
Hi
Is it possible to implement a hoverintent behavior to mega menu? (Like superfish menu).
Would be nice all drop down menus to have a subtle time delay when hovering in and out of them.
Now they drop down instantly.

Regards
User avatar
Fresh Boarder

GK User
Tue May 24, 2011 6:39 pm
megamenu is a product of joomlart that is with t3 framework...

try ask in there forum maybe...
User avatar
Platinum Boarder

GK User
Wed May 25, 2011 7:08 am
Hi
I posted the same question in their forum. I hope it will be answered.
By the way very nice templates you have but I am very surprised that you never addressed this issue before. In my opinion is a serious usability issue, because:
A mega drop-down menu should only appear after the user has been hovering for 0.5 seconds. If the menus are set to appear instantly, and a user is casually rolling their mouse over the menu, they’ll see a bunch of menus flickering about — and that’s a nuisance.
These are the words of usability guru Jakob Nielsen and I totally agree with him.
I love "yourshop" template and I would really like to find a solution to this hoverintent problem.

Any ideas?

Best Regards
User avatar
Fresh Boarder

GK User
Wed May 25, 2011 8:54 am
Hi

On template parameters > Menu you can choose "Animation Type" as "slide" and increase "Animation duration" to (i.e.) 1000.

Try it ;)
User avatar
Platinum Boarder

GK User
Wed May 25, 2011 2:01 pm
Hi
Thank you for the tip. I tried it but it's not the same. The mouse still triggers the menu. It only takes about a second to appear.
I know it can be done with jQuery and a small plugin called hoverIntent. jQuery has its own hover event, but it fires as soon as the mouse touches the target area. Instead, we want to implement the delayed effect: that is, we’d like to wait for the user to stop moving their mouse. The hoverIntent plugin provides for this by taking the mouse movement speed into account.
But unfortunately I am not an expert in javascript. There could be conflicts from such an implementation.
That is why I asked you in the first place. You have a team of programmers and it would be nice to implement it to your templates. For me this is a week point of mega menu, if you have a lot of sub menus. All the time menus are flying around as soon as the mouse passes over. Even in joomlart's own website.
By the way in "yourshop" template if the mouse is moving from page top down, the sub menus stay open.
Thank you again for your tip and I hope that a solution will be found.

Best Regards
User avatar
Fresh Boarder

GK User
Thu May 26, 2011 9:10 am
Hi

ok let's try this:

Open ../gk_yourshop/js/menu/mega.js and replace this line:

Code: Select all
transition: Fx.Transitions.Sine.easeOut,

with
Code: Select all
transition: Fx.Transitions.linear,


Set animation speed to (i.e.) 500.

Is this what you need?

Cheers ;)
User avatar
Platinum Boarder

GK User
Thu May 26, 2011 1:01 pm
First of all thanks for the interest in my problem even though it doesn't concern you directly.
(I mean it's a T3 Joomlart concern).

I tried it and it doesn't change much.
What I need is a function similar to superfish menu. The mouse should not trigger the sub menus instantly.
If I don't find a solution I have to use another menu but if you want to investigate further I can send you a .js with this function .
Can you please tell me how to deactivate mega menu and use something else instead? (I'm new to T3).
I really want to use this template it is very professional.

Best Regards
User avatar
Fresh Boarder


cron