Skip to main content

Bug Tracker

Side navigation

#13489 closed bug (notabug)

Opened February 21, 2013 08:12AM UTC

Closed February 21, 2013 02:25PM UTC

I have made a menu with several link items when we hover them a image along with those links changes with a small fade in fade out effect. It works fine but when i move my mouse rapidly over all these links then mouse follow all events one by one and starts bubbling with fading effect multiple times. What should i do? My code is something like this following..

Reported by: akshay8@hotmail.com Owned by:
Priority: undecided Milestone: None
Component: unfiled Version: 1.7.1
Keywords: Cc:
Blocked by: Blocking:
Description

jQuery('.level1.nav-1 > a,.level1.nav-2 > a,.level1.nav-3 > a,.level1.nav-4 > a,.level1.nav-5 > a,.level1.nav-6 > a,.level1.nav-7 > a,.level1.nav-8 > a,.level1.nav-9 > a,.level1.nav-10 > a,.level1.nav-11 > a,.level1.nav-12 > a,.level1.nav-13 > a,.level1.nav-14 > a,.level1.nav-15 > a,.level1.nav-16 > a').mouseleave(

function () {

jQuery('.dropdown_1columns > div').find('img[src*="coll-exclusive.png"]', this).attr('src', 'http://zevarr.com/skin/frontend/gt002-fazhionis/default/images/back/ZExclusivecoll-exclusive.png').fadeOut("200");

});

jQuery('.level1.nav-1 > a').mouseenter(

function () {

jQuery('.dropdown_1columns > div').find('img[src*="coll-exclusive.png"]', this).attr('src', 'http://zevarr.com/skin/frontend/gt002-fazhionis/default/images/back/Aliyacoll-exclusive.png').fadeIn("200");

});

jQuery('.level1.nav-2 > a').mouseenter(

function () {

jQuery('.dropdown_1columns > div').find('img[src*="coll-exclusive.png"]', this).attr('src', 'http://zevarr.com/skin/frontend/gt002-fazhionis/default/images/back/Arracoll-exclusive.png').fadeIn("200");

});

and for more images nav-3, nav-4 and so on...

Attachments (0)
Change History (1)

Changed February 21, 2013 02:25PM UTC by ajpiano comment:1

resolution: → notabug
status: newclosed

Thanks for your report but this bug tracker is not a support forum. However, you may want to investigate the hoverIntent plugin (http://cherne.net/brian/resources/jquery.hoverIntent.html), which ensures that the user "intends" to hover (by waiting for a short delay) and can prevent the type of stacking of many effects that you are describing here. For further support requests, please visit the jQuery Forum (http://forum.jquery.com)