I am trying to change the image on hover but it doesnt seem to work, any idea? the css doesnt also work. basically what it does is when the link is hover, the image should change with a scaling effect
<script>
$('#c_menu2').hover(function(){
$('img.hut2').attr("src", "Images/hut2.png");
$('img').css( { -moz-transform:'scale(1.04)',
-webkit-transform:'scale(1.04)',
-o-transform:'scale(1.04)' } );
$(this).css( { color: '#b26c64'});
}, function(){
$('img.hut2').attr("src", "Images/hut.png");
$('img.hut2').css( { height:'195px',
width:'240px',
-moz-transition:'-moz-transform 0.1s ease-in',
-webkit-transition:'-webkit-transform 0.1s ease-in',
-o-transition:'-o-transform 0.1s ease-in' } );
$(this).css( { color: '#000'});
});
$('img.hut2').hover(function(){
$('#c_menu2').css( { color: '#b26c64'});
}, function(){
$('#c_menu2').css({ color: '#000'});
});
</script>