Question

我有一张图片。如果你鼠标悬停它，下一个img和上一个图像的控件出现，显示在图像上（通过css移动到那里）。如果我将图像鼠标移出控件，shell就会消失。

问题是，如果我鼠标悬停在其中一个控件上，我将鼠标移出图像并且控件消失： - （

我该怎么处理？我尝试过类似的东西，但它没有做到这一点： var control = false;

    $('.detail_img').bind('mouseover', function(){
        $('.gal_control').fadeIn(200);
    });

    $('.detail_img').bind('mouseout', function(){

        if(!control) $('.gal_control').fadeOut(400);
    });
    $('.gal_control').bind('mouseover', function(){
       control = true;
    });
    $('.gal_control').bind('mouseout', function(){
       control = false;
    });

感谢帮助我

html ...对于没有幻想的所有人： - ）

<div class="rollover_left gal_control"></div>
<div class="rollover_right gal_control"></div>
<img class="detail_img" id="detail_img" src...>

更新

var control = false;


    $('.detail_img').bind('mouseover', function(){
        control = true;
        $('.gal_control').fadeIn(200);

    });

    $('.detail_img').bind('mouseout', function(){
        control = false;
    });
    $('body').bind('mouseover', function(){
       if(!control)  $('.gal_control').fadeOut(400);
    });

    $('.gal_control').bind('mouseover', function(){
       control = true;
    });
    $('.gal_control').bind('mouseout', function(){
       control = false;
    });

我的意思是，现在这样做了，但有更好的方法吗？我可以优化这些线吗？

Answer 1

我会尝试以下一项或两项：

将图像和控件包裹在<div>中，并将鼠标事件附加到div而不是图像
尝试使用mouseenter和mouseleave个事件代替mouseover / mouseout

如何使用jquery进行嵌体控件切换？

1 个答案: