Tenho o seguinte código em html, preciso que quanto ocorrer o evento hover, o link que está no data-hover vá para o src, e ao tirar o mouse, volte o link do src.
<img src="images/manada.jpg" data-hover="images/manada-hover.jpg" class="img-responsive">
Até havia conseguido fazer algo parecido, porém quando eu passava o mouse a imagem trocava, e quando eu tirava, a imagem continuava, só trocava quando eu passava o mouse novamente (tinha que fazer 2 hovers para voltar para a img original).
Existe alguma maneira de fazer isto com css?
Se não, pode ser js mesmo.