Q_28269594

Change image source on a.hover()

by ChrisStanyon

HTML

<ul id="accordion"> 
   <li><a href="http://anysite.tld" ><img data-imageid='0' src="off_0_MouseOff.jpg"/>test</a></li>
   <li><a href="http://anysite.tld" ><img data-imageid='1' src="off_1_MouseOff.jpg"/>test</a></li>
   <li><a href="http://anysite.tld" ><img data-imageid='2' src="off_2_MouseOff.jpg"/>test</a></li>
</ul>

JavaScript

$('#accordion li').hover(
function() {
   var img = $(this).find('img');
   var imgName = 'on_' + img.data('imageid') + '_MouseOver.jpg';
   img.attr('src', imgName);
},
function() {
   var img = $(this).find('img');
   var imgName = 'off_' + img.data('imageid') + '_MouseOff.jpg';
   img.attr('src', imgName);
});