码迷,mamicode.com
首页 > 其他好文 > 详细

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

时间:2018-07-13 19:11:46      阅读:199      评论:0      收藏:0      [点我收藏+]

标签:func   冒泡   接下来   定制   鼠标   hicon   创建   使用   动画效果   

//鼠标移入事件,此处使用的是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)
})

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

标签:func   冒泡   接下来   定制   鼠标   hicon   创建   使用   动画效果   

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!