Response title
This is preview!
Need help with code.... 90% there!
in Using jQuery
•
9 years ago
Hi,
Here's my demo.
I am trying to get the yellow bars to show on top of all the light gray boxes upon hover. The darker gray boxes (first and last children) are to be ignored by the code.
On hover out, I want the yellow box (for that row) to fade out and detach() from the DOM.
I feel like I am close to having things working, but there are a few problems:
1. If you hover over a "row", the animation of the yellow box will loop and animate-in/fade-out. Cause: The yellow div, I think, is allowing the hoverIntent plugin to think that it should call the "out" function due to the way I have things setup.
2. If I hover over multiple "rows" quickly, then the rollout function for the last row will apply to all current yellow boxes (i.e. all yellow boxes will stop(), fadeOut() and detach())... I kinda want each row to start and end independently of one another.
I would love some tips on how to handle things better.
Many thanks in advance!
Cheers,
Micky
Here's my demo.
I am trying to get the yellow bars to show on top of all the light gray boxes upon hover. The darker gray boxes (first and last children) are to be ignored by the code.
On hover out, I want the yellow box (for that row) to fade out and detach() from the DOM.
I feel like I am close to having things working, but there are a few problems:
1. If you hover over a "row", the animation of the yellow box will loop and animate-in/fade-out. Cause: The yellow div, I think, is allowing the hoverIntent plugin to think that it should call the "out" function due to the way I have things setup.
2. If I hover over multiple "rows" quickly, then the rollout function for the last row will apply to all current yellow boxes (i.e. all yellow boxes will stop(), fadeOut() and detach())... I kinda want each row to start and end independently of one another.
I would love some tips on how to handle things better.
Many thanks in advance!
Cheers,
Micky
1
