In general, there are better ways of doing this.
One way is with a sprite. (Background or foreground)
http://learningtheworld.eu/2007/foreground-sprites/
Browsers are very fast at CSS, and not nearly as fast at replacing
graphics. Many browsers show a flicker.
If you use a sprite then it works faster and smoother.
Another way is to have both images in the dom. Then change
display:none/block on hover so it shows one or the other.
There are lots of methods. The one you have has flicker written all over
it. :)
Glen
On Dec 4, 2007 4:10 PM, DaveG <[EMAIL PROTECTED]> wrote:
>
> I'm trying to change an elements class on mouse-over/out. The code below
> seems to fire repeatedly when the mouse moves over the target, even when
> the mouse is stationary, causing a slow (10/sec) flicker effect. What's
> causing the flicker? I was expecting the over/out functions to fire once
> on mouse over, and once on mouse out.
>
> jQuery("[EMAIL PROTECTED]'xxx-']").hover(
> function(){
> jQuery(this)
> .attr(
> 'class',
> this.className.replace(/xxx-(\w+)-off/gi, 'xxx-$1-on')
> );
> },
> function(){
> jQuery(this)
> .attr(
> 'class',
> this.className.replace(/xxx-(\w+)-on/gi, 'xxx-$1-off')
> );
> }
> );
>
>
>
> ~ ~ David
>
