mousemove focus is lost when DOM modification is initiated on FF5

Question

Demo:

http://anuary.com/dev/hp/pad3/

Scenario:

On arrival to the page, you will notice finger following your cursor. Click on any of the videos, click on the video again. (don't click anything anymore; this should close the video) mousemove is no longer responding unless clicked anywhere on the document.

This is caused by the following lines (200):

$.hp.ul.find('img').show();
$.hp.ul.find('li object, li div').remove();

Commenting them out makes everything work again.

Bug found on OSX, FireFox 5. Please report if this bug does not appear on your OS/browser.

What's the problem? How to fix this?

An update:

This appears to be a much more serious thing and probably OS/Browser bug. The thing is that when the cursor disappears and you are trying to go outside of the browser window, the cursor is still invisible. (unless you click somewhere)

Any workaround solutions are appreciated.

Answer 1

You can try:

$(document).live('mousemove', function(e){      
        cursor.css({
            left:  e.clientX-tab.offset().left-60,
            top:   e.clientY-tab.offset().top+15
        });
    });

Although I'm not able to reproduce this on FF5/Chrome (Win XP). Video doesn't stop (even though the image is shown, it plays in background).

Also, your implementation interferes with addons like Flashblock, something you might want to consider.