Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript fade in fade out issue Re: fade in fade out issue

#91377
mattgoucher
Member

I think your going about this in the wrong direction a bit. In your most recent example, it looks like you have one container with that the text is supposed to populate?

To me, it would make the most sense to grab the text from each of the images, and use jquery to add a span or somthing.

Example (Fiddle)


$(document).ready(function(){
$('#list li').hover(

function(){
// When Hovering
var title = $(this).children('img').attr('title'),
span = $(this).children('span');

if ( span.length ) {span.fadeIn('fast');return;}

span = $('')
.text( title );

span.appendTo($(this));


},
function(){
// When Not Hovering
var span = $(this).children('span');
span.fadeOut('fast');
}
);
});

In the example above, I’m using jquery to add a span, and after the user has stopped hovering, I hide the span. The second time around, jQuery doesn’t touch the DOM at all, I’m just fading the already created span in.