jQuery Hover на двух отдельных элементах

Question

У меня есть две установки отдельных элементов, которые отображаются на разных частях DOM - проблема, с которой я столкнулась, заключается в том, что они абсолютно расположены, и я не могу их обернуть в контейнер div.

У меня настроить JSfiddle здесь - http://jsfiddle.net/sA5C7/1/

То, что я пытаюсь сделать: переместить элементы в и вместе - так что пользователь может перемещать их мышью между тем или иным элементом и только как только они СЛЕДУЕТ ли это снова спрятаться?

Как я могу настроить это? Потому что на данный момент, когда я удаляю один элемент - он запускает событие «оставить событие» для этого элемента и т. Д.

Answer 1

Вы можете использовать две булевы переменные, которые вы задаете, для каждого элемента. Это становится правдой, когда вы вводите элемент и false, если вы уходите.

И только когда оба являются ложными при уходе => скрыть элементы.

$(document).ready(function(){ 
    var bslider = false; 
    var btest = false; 
    $('#slider').mouseover(function() { 
     bslider = true; 
     $('#slider, #test').stop(true,false).animate(
        {'margin-left':'20px' 
        }); 
    }); 
    $('#test').mouseover(function() { 
     btest = true; 
     $('#slider, #test').stop(true,false).animate(
        {'margin-left':'20px' 
        }); 
    }); 
    $('#slider').mouseout(function() { 
     bslider = false; 
     if(!bslider && !btest) 
     { 
      $('#slider, #test').stop(true,false).animate(
        {'margin-left':'0' 
        }); 
     } 
    }); 
    $('#test').mouseout(function() { 
     btest = false; 
     if(!bslider && !btest) 
     { 
      $('#slider, #test').stop(true,false).animate(
        {'margin-left':'0' 
        }); 
     } 
    }); 
});