I can access properties (like height or width) of the global Image object. But I cannot immediately access these properties of the local Image object. This is demonstrated in the following code, in which the width of the global image is correctly reported, but the width of the local image is 0.
Note that this happens ONLY the first time. If you click the button a second time, or simply reload the page, then the local image properties are available. The issue occurs in Firefox, Chrome, and Safari. (Opera, however, is able to read the image properties the first time.)
If I use setTimeout to allow the function to "think," then the local image properties are available. For example, if I modify go() as follows...
The timeout can be as low as 0 in Safari and Firefox, but it's essential. If that line is replaced with a direct call to think(), then it won't work. In Chrome, the timeout needs to be at least 2 (perhaps because 0 or 1 are just optimized to be immediate?).
Does anyone know what exactly is happening here?
Or to the point, what is the best approach for accessing properties of locally created Image objects?
"We're kind of on the level of crossword puzzle writers... And no one ever goes to them and gives them an award." ~Joe Strummer sscce.org