mike503 wrote on 11/8/2007 3:16 AM:
Thank god someone else can validate this.
I played with it a bit. It appears the anonymous functions being bound to mousseover and mouseout don't have access to the functions outside themselves when the page is first being loaded (perhaps they're not fully bound yet?). Below is a simple test case, load it in Firefox, pop open Firebugs, place the cursor over the "Test Span", hit Ctrl-R to reload the page and rapidly move the cursor in/out of the "Test Span." If you do, you'll see the error "xyzzy is not defined" when the page is first loading, then the error goes away once those anonymous functions have access to functions outside themselves. And the problem occurs regardless of the placement of JavaScript on the page; it still happens when all the JavaScript is in the <head> as well. One work-around is to surround all the code contained within the anonymous functions with try/catch, and simply ignore the errors. - Bil <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Demo</title> </head> <body> <span id="test">Test Span</span> <script src="jquery-1.2.1.js" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> function xyzzy() {}; // noop $(function(){ $("#test").mouseover(function() { xyzzy(); $(this).css("background-color", "#7dbeee").css("cursor", "pointer"); }); $("#test").mouseout(function() { xyzzy(); $(this).css("background-color", "#ff9900").css("cursor", "default"); }); }); </script> </body> </html>