Q: Flickering on hover with mousemove I'm attempting to build a hover effect inspired by golden-spike.com (and adapting their code, actually). Having some trouble, though, since their code uses a negative z-index, which I cannot use because I need there to be a background color on the page.
Here is the jsFiddle. You'll notice if you change the z-index on the .show_img class to -1 the flickering disappears completely.
Here's the Javascript I'm currently using:
$(document).ready(function() {
var mouseX;
var mouseY;
$(".title").mousemove( function(e) {
   mouseX = e.clientX; 
   mouseY = e.clientY;
});  
$(".title").hover(
  function () {
    $(this).next(".show_img").css("visibility","visible");
    $(window).bind('mousemove', function(e){
        $(".title").next(".show_img").css({'top':mouseY,'left':mouseX});
    });
  },
  function () {
    $(".show_img").css("visibility","hidden");

  });
});

Thanks in advance for any help!

A: Try positioning the image a little further from the cursor
mouseX = e.clientX + 5; 
mouseY = e.clientY + 5;

jsFiddle Example
The problem was that the hover event triggered an image that covered the text being hovered.

A: The mouse move event gets captured by the image element which turns the hover off and if it bubbles up to the title it's fired again:
Try:
$(".title").next(".show_img").css({'top':mouseY+10,'left':mouseX+10});

DEMO
http://jsfiddle.net/tNms9/423/
