我试图延迟动画，为此任务我在500毫秒后添加$(document).ready(function() {
$('.like')
.on('ajax:success', function (e, data, status, xhr) {
$('.like_number').html(data.count)
})
.on('ajax:send', function () {
$(this).addClass('loading');
})
.on('ajax:complete', function () {
$(this).removeClass('loading');
})
.on('ajax:error', function (e, xhr, status, error) {
console.log(status);
console.log(error);
})
$('.downvote')
.on('ajax:success', function (e, data, status, xhr) {
$('.unlike_number').html(data.count);
})
.on('ajax:send', function () {
$(this).addClass('loading');
})
.on('ajax:complete', function () {
$(this).removeClass('loading');
})
.on('ajax:error', function (e, xhr, status, error) {
console.log(status);
console.log(error);
})
});
类动画。
.startAnimation<div class="layout">Hover It</div>
<div class="hoverDiv"></div>
但问题是setTimeout(function(){
$(".layout").addClass('startAnimation');
}, 500);
$('.hoverDiv').hide();
$('.startAnimation').hover(function(){
$('.hoverDiv').show();
});
无法使用已添加的课程hover()，但是它与位于同一.startAnimation的{{1}}类一起使用。我检查.layout类是否在500毫秒后正确添加。任何人都可以指导我解决这个问题，我可以解决它。我将不胜感激。
以下是参考Demo
答案 0 :(得分：1)
将事件委派与mouseenter，mouseleave事件一起使用。
$(document).on('mouseenter mouseleave', '.startAnimation', function(){
$('.hoverDiv').toggle();
});
答案 1 :(得分：0)
使用鼠标悬停事件而不是悬停。它会起作用。
$(document).on('mouseover', '.startAnimation', function(){
$('.hoverDiv').show();
});