jquery 鼠标经过 Animate动画效果
注:图片默认是不动的,当鼠标经过的时候才会动。
原理很简单--通过js,添加鼠标经过事件,鼠标经过时,把当前元素存放在“data-in”里的“swing”添加到class里,前提animated这个类一定要加上,要不然动画不起作用。
1.html结构
--先引入css文件
1.
<link href="animate.min.css" rel="stylesheet">
2.
$(".hover_").on("mouseenter",function(e){
    var This=$(this);
    var hin=This.attr("data-in");
    This.addClass(hin);
    This.one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd 
oanimationend animationend', function(){
    $(this).removeClass(hin);
    });
});