javascript - Howto add fade in / fade out to this thumb preview -


how can add fade-in on hovering thumbs?

http://jsfiddle.net/gaa7d/1/

the magic js needs fade:

function showt( image ){document.getelementbyid( 'ima' ).setattribute('src',image )} 

some more:

<img id="ima" src="http://www.google.com/images/srpr/logo3w.png" height="75" width="75"/>  <a href="#" onmouseover="showt( 'http://www.google.com/logos/2012/cossington_smith-12-hp.jpg' )">pic 1</a> <a href="#" onmouseover="showt( 'http://www.google.com/logos/2012/earthday12-hp.jpg' )">pic 2</a> <a href="#" onmouseover="showt( 'http://www.google.com/logos/2012/friedrich_frobel-2012-hp.jpg' )">pic 3</a> 

here quick jquery example:

$('#ima').fadeout(function(){     $('#ima').attr('src', image).fadein() }); 

fiddle

to make fade in/out faster:

$('#ima').fadeout('fast', function(){     $('#ima').attr('src', image).fadein('fast') }); 

you swap out 'fast' fade duration in milliseconds.

fiddle


Comments

Popular posts from this blog

c# - DetailsView in ASP.Net - How to add another column on the side/add a control in each row? -

javascript - firefox memory leak -

Trying to import CSV file to a SQL Server database using asp.net and c# - can't find what I'm missing -