Очень быстрый сброс jQuery итераций Сброс

Question

Я использую следующий код для замены <div> содержимого.Он функционирует должным образом, за исключением поведения мыши и мышиного поведения блоков, которое показывает неправильное.Имя класса "flipped" имеет отображаемый набор, равный none.Должен ли я проверить состояние, использовать setTimeout () или другой метод для предотвращения этого поведения?

HTML-код

<div class="videobox">
        <div class="unflipped">
            <img src="videoprop.jpg">
            <div class="desc_over">This is a description! Video Contains This!</div>
        </div>
        <div class="flipped">This what displays when flipped 1!</div>
    </div>

JQuery

$(".videobox").hover(function(){
            $(this).children(".unflipped:first").fadeOut("fast",function(){
                $(this).next(".flipped:first").fadeIn("fast");
            });         
        },function(){           
            $(this).children(".flipped:first").fadeOut("fast",function(){
                $(this).prev(".unflipped").fadeIn("fast");
            }); 
        });

Answer 1

Попробуйте разделить их:

$('.videobox').find('.unflipped').mouseenter(function() {
    $(this).fadeOut("fast", function() {
        $(this).next(".flipped").fadeIn("fast");
    });
});
$('.videobox').find('.flipped').mouseleave(function() {
    $(this).fadeOut("fast", function() {
        $(this).prev(".unflipped").fadeIn("fast");
    });
});