jQuery+css3制作一款简单漂亮的鼠标悬停按钮动画特效,可以感知鼠标方向,动画效果从鼠标进入方向出现。
js代码
<script>
$( ".button_su_inner" ).mouseenter(function(e) {
var parentOffset = $(this).offset();
var relX = e.pageX - parentOffset.left;
var relY = e.pageY - parentOffset.top;
$(this).prev(".su_button_circle").css({"left": relX, "top": relY });
$(this).prev(".su_button_circle").removeClass("desplode-circle");
$(this).prev(".su_button_circle").addClass("explode-circle");
});
$( ".button_su_inner" ).mouseleave(function(e) {
var parentOffset = $(this).offset();
var relX = e.pageX - parentOffset.left;
var relY = e.pageY - parentOffset.top;
$(this).prev(".su_button_circle").css({"left": relX, "top": relY });
$(this).prev(".su_button_circle").removeClass("explode-circle");
$(this).prev(".su_button_circle").addClass("desplode-circle");
});</script>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791