I have written a really simple tooltip style rollover that tracks the mouse position and on mouseover displays a span.

This is all working great the problem is when the user moves the mouse the browser processes the movement of the span slightly slower than the mouse causing a mouseout when the mouse moves over the displayed span tag. This results in the span to fadein/fadeout a few times (flash)

I have reduced this by adding a 5x 5y space but if the user moves the mouse with a bit of speed it catches up resulting in the flashing fadein/fadeout effect.

I have tried on the mouseout checking if ($(this).not('span')) but im guessing 'this' will be the 'a' selector from the mouse out.

My initial guess would be to check on mouse out that the user is not 'mouseover' on the span tooltip then fadeout I just can't figure out how to approach this.

$(document).ready(function() {
   $('span').hide();
   $("a").mouseover(function() {
      var id = '.'+$(this).attr("id");
      $(id).fadeIn(600);
      $().mousemove(function(e){
         $(id).css("top",e.pageY+5);
         $(id).css("left",e.pageX+5);
      });
   });
   $("a").mouseout(function() {   
      $("span").fadeOut(400);
   });
});

Just hide the tooltip on mouseout, and show it on mouseover. What are you not understanding there? The way I do it I use as much raw JavaScript as possible, because it is faster (using all jQuery functions will definitely slow things down).

Also of note, you should be using the clientX and clientY properties to track the mouse position instead of pageX and pageY, because it is (I think) more compatible and accurate across browsers.

If you want to study my tooltip, here it is: jQuery tooltip

Also, take advantage of jQuery's plugin mechanism! It is awesome, though it isn't anything special: all you do is build prototypes of the jQuery object. If you've never built a prototype before, now is a good time to learn. Think of prototype functions as being able to inherit all of the properties of their parent functions, because that is exactly what they do. When you build a prototype of jQuery, you may refer to the DOM object it creates with the "this" keyword. The "this" in jQuery is always an array object, even if it is only one item.

When you make a plugin, always return "this", or the element chain via an $().each, so that your function can be chained to more functions.

jQuery's inheritance scheme is very much like class-based inheritance, but in a uniquely JavaScript manner, which is why I like it so much.