Keeps fading in after, mouseover

Answer 1

Try this:

$("p.follow").hover(function()
   {
      $(this).stop().fadeTo("slow", 1.00);
   },
   function()
   {
      $(this).stop().fadeTo("fast", 0.50);
   });

Two key differences: I use the jQuery hover event to associate mouseover and mouseout event handlers such that child elements won't result in confusing behavior, and i use the stop() function to prevent animations from overlapping and canceling each other out.

Answer 2

A mouseover-event is fired every time your mouse moves over the element. Since effects are executed sequentially and a mouseover is fired pretty frequently, you get a lot of effects that have to be executed "slow".

What you probably want is the hover-event, which is only executed once for each entry.

Answer 3

Very interesting. I never knew that, I will keep this in mind for further uses! So the stop is the main important part? For it does not overlap?

Ryan

Answer 4

It may be worth looking at the hoverintent plugin, this basically uses a little setTimeout so that it wont activate if a user quickly moves the mouse across the element instead. Easy to code yourself but worth a look.