Ran into a strange issue using
jqueryUI highlight effect, the issue only occurred with
Webkit browsers (Google Chrome and Safari) and only when I was manipulating the background property of the element that was being highlighted.
Using a slightly modified version of the
demo. I tweak the background image before applying the highlight effect
$("#highlight").click(function() {
$(this).css("background", "url(some_image.png) no-repeat");
$(this).effect("highlight");
});
This resulted in the highlight appearing but not going away. Then checking it in the debugger the following javascript error was being generated - “Uncaught TypeError: Cannot read property ‘0’ of undefined,” Changing the background manipulation to the following fixed the issue.
$(this).css("background-image", "url(some_image.png)");
$(this).css("background-repeat", "no-repeat");
$(this).effect("highlight");
Update 2009-03-06: You also need to make sure that if there is an existing style on the element being highlighted it is using the more verbose style tags of background-image and background-repeat or the same error will be encountered