jquery - Anchor tag scroll animation using images with a tags -

the code below animates same-page anchor links <a href="#contact">contact</a>, animation doesn't work if combine image <a href="#to-top"><img src="images/logo.png"></a>. image, click take destination, without animation.

the destinations have format this: <div id="contact">...</div>.

any ideas i'm doing wrong?

$('a').click(function(){ // tried changing 'a' 'img', no avail...     var topoffset = 68;     $('html, body').animate({         scrolltop: $( $.attr(this, 'href') ).offset().top-topoffset+2     }, 800);     return false; }); 

but animation doesn't work if combine image . image, click take destination, without animation.

appear perform animation effect @ stacksnippets ?

$('a').click(function(){ // tried changing 'a' 'img', no avail...      var topoffset = 68;      $('html, body').animate({          scrolltop: $( $.attr(this, 'href') ).offset().top-topoffset+2      }, 800);      return false;  });

#contact {    position:relative;    top:200px;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <a title="click" href="#contact"><img src="http://lorempixel.com/50/50/technics/" /></a>  <div id="contact">...</div>