Edit in JSFiddle

$.fn.upHover=function(){return $(".upHover").each(function(){var e=$(this),r=e.prop("outerHTML").replace('class="upHover"',"");e.after('<div class="upHover">'+r+"</div>"),e.remove()}),$(".upHover").hover(function(){$(this).addClass("active")},function(){$('.upHover').removeClass('active');}),this};
$(document).upHover();
	<div class="page-wrap">
		<h5 class="upHover">upHover</h5>
		<p><b class="upHover">upHover is brilliant</b> principium autem unde latius se funditabat, emersit ex negotio tali. Chilo ex vicario et coniux eius Maxima nomine, questi apud Olybrium ea tempestate urbi praefectum, vitamque suam venenis petitam adseverantes inpetrarunt ut hi, quos suspectati sunt, ilico rapti conpingerentur in vincula, organarius Sericus et Asbolius palaestrita et aruspex Campensis.
        </p>
            <h5 class="upHover">^&ndash;&ndash;&ndash;(&deg;)~~~(&deg;)&mdash;&ndash;&ndash;^</h5>
			<img src="http://raw.uplaod.fr/test_bastien/hover/HAND.png" class="upHover" style="padding-top:20px;" width="300">
	</div>
/* upHover */
@-webkit-keyframes hover{
0%{-webkit-transform:translateY(0px)}
50%{-webkit-transform:translateY(-3px)}
100%{-webkit-transform:translateY(0px)}
}
@-webkit-keyframes shadow{
0%{-webkit-transform:translateY(0px);opacity:.4;filter:alpha(opacity=40)}
50%{-webkit-transform:translateY(3px);opacity:1;filter:alpha(opacity=100)}
100%{-webkit-transform:translateY(0px);opacity:.4;filter:alpha(opacity=40)}
}
.upHover{display:inline-block;cursor:pointer;padding:0 ;position:relative;-webkit-animation:none;-webkit-transition-duration:0;-webkit-transition-property:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-transform:translateZ(0);animation-play-state: initial}
.upHover:before{content:' ';pointer-events:none;position:absolute;z-index:-1;top:100%;left:5%;height:10px;width:90%;opacity:0;filter:alpha(opacity=0);background:radial-gradient(ellipse at center,rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 80%);transition-duration:0;transition-property:none}
p .upHover:before{top:70%!important}
.upHover img{display:inline;cursor:pointer}
.upHover.active{-webkit-transform:translateY(0px);-webkit-animation:hover 1.5s steps(10) infinite alternate;-ms-animation:hover 1.5s steps(10) infinite alternate;-webkit-animation:hover 1.5s steps(10) infinite alternate}
.upHover.active:before{opacity:.4;filter:alpha(opacity=40);-webkit-transform:translateY(0px);-webkit-animation:shadow 1.5s steps(10) infinite alternate;-ms-animation:shadow 1.5s steps(10) infinite alternate;-webkit-animation:shadow 1.5s steps(10) infinite alternate}

/* DEMO */
p {  font-family: 'Arial';}
.page-wrap {
  font-family: 'Arial';
  width: 90%;
  max-width: 960px;
  margin: 0 auto 200px;
}
 .upHover  h5 {
	padding:  0;
	font-size: 2em;
 	margin:  0;
	display: inline;
}