I am trying to build a notification popup bubbles system like what we find on Facebook (For example, if you are connected on Facebook and someone has just commented your photo on Facebook, a popup bubble would appear at the bottom on the right of your computer screen informing you about that). I almost finished building such system, but it still just one problem to fix.In fact, it is supposed that when you mouseover a notification popup bubble its animation stops, then if you mouseout it, there will be a fadeOut after a short time (for example 5 seconds). The problem is that when you mouseover and mouseout the notification popup bubbles several times there will be a fadeOut for each bubble you mouseout it after a very short time (let's say after less than a second) and not after 5 seconds (Which is not what it is expected). For more explanation, please have a look at this link: notification popup bubbles system code (it is my code for the notification popup bubbles system I am trying to build). Then, please click on the button "Click" to create the bubbles. Afterwards, pass the mouse pointer over the created bubbles from bottom to top and from top to bottom several times and after some seconds you will notice what I was telling you about. My question is how can I resolve that problem and make the system work correctly?..what is wrong in my code?
Thanks in advance.
