首页 > 其他 > 详细

鼠标移入通过时间控制实现两个不同步的动画效果

时间:2018-07-13 18:37:36      阅读:198      评论:0      收藏:0      [点我收藏+]

//鼠标移入事件,此处使用的是enter,与over不同的是,enter不支持冒泡
$(‘.lis td‘).mouseenter(function(){
$(this).find(‘.tuwz‘).stop().animate({‘margin-top‘:‘-40px‘},500)
//在class名为mis的标签下创建子标签
$(this).find(‘.mis‘).html(‘<div class="yiru">misadidas 定制 <i class="glyphicon glyphicon-circle-arrow-right"></i></div>‘)
$(this).find(‘.yiru‘).css({‘cursor‘:‘pointer‘})
$(this).find(‘.mis‘).css({‘background‘:‘#000‘,‘color‘:‘#fff‘})
//stop:停止之前所有的动作,只执行接下来的动作。
$(this).find(‘.glyphicon‘).stop().animate({‘margin-right‘:‘-10px‘},1000)
}).mouseleave(function(){
$(this).find(‘.tuwz‘).stop().animate({‘margin-top‘:‘0px‘},200)
})

鼠标移入通过时间控制实现两个不同步的动画效果

原文:https://www.cnblogs.com/amberoid/p/9306340.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!