html结构:
<div class="box">
<div class="item"></div>
<div>模块入口</div>
</div>
js部分:
$('.box').on('mouseover','.item',function () {
$(this).stop().animate({'fontSize': '60px'}, 400);
});
$('.box').on('mouseout','.item',function () {
$(this).stop().animate({'fontSize': '50px'}, 400);
});
问题:box下的第一个div因为是后端动态加载,因此只有使用事件代理。js的hover事件并不支持事件代理,如果想使用事件代理就必须使用mouseover与mouseout进行代替。但实际执行结果为鼠标移入<div class="box">并无反应,鼠标移入<div class="item"></div>才会有实际的动画效果。哪里的问题呢?
补充:最终目的是鼠标移入box,item的字体动画生效