jQuery mouseover / mouseout闪烁

我有以下 HTML

<div class="individual">
    <div class="change">change</div>
    <div class="picture"><img src....></div>
</div>

.change的位置是：绝对的;并且是看不见的.在mouSEOver .picture上,我希望.change出现,并在mouSEOut上消失.如果个人点击.change,那么应该发生一些事情.

现在,当鼠标移过更改时,它被视为图片的鼠标输出,因此更改开始闪烁！

然后我做了这个jQuery：

$('.change').mouSEOut(function(){
    $('.picture').mouSEOut(function(){
        $(this).parent().children('.change').hide();
    });
});

$('.picture').mouSEOver(function(){
    var i = $(this).parent().children('.change').show();
});

这只是第一次工作正常！如果我移出图片,那么当我回来并继续改变时,一切都开始闪烁！我该怎么办？！

谢谢

解决方法

使用’mouseenter’代替’mouSEOver’和’mouseleave’代替’mouSEOut’

$('.picture').mouseenter(function(){
   $(this).parent().children('.change').hide();
});



$('.picture').mouseleave(function(){
    var i = $(this).parent().children('.change').show();
});