jQuery pull div из родительского div

У меня есть div-боксы друг на друга, и я хотел бы скрыть верхний, если кто-то на него нависает. HTML:jQuery pull div из родительского div

<div id="left_middle"> 
<div id="rfinder_UP"></div> 
<div id="rfinder_DWN"></div> 
</div>

CSS:

#left_middle { 
position:relative; 
float: left; 
width: 235px; 
min-height: 220px; 
background:green; 
margin-right: 10px; 
-moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    -ms-border-radius: 5px; 
    -o-border-radius: 5px; 
    -khtml-border-radius: 5px; 
    border-radius: 5px; 

} 

#rfinder_UP, 
#rfinder_DWN { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    -ms-border-radius: 5px; 
    -o-border-radius: 5px; 
    -khtml-border-radius: 5px; 
    border-radius: 5px; 
} 

#rfinder_DWN{ 
background: url(images/rfinderapp_DWN.png) no-repeat; 

} 

#rfinder_UP { 

    background: url(images/rfinderapp_UP.png) no-repeat; 
    z-index: 10; 
}

$(document).ready(function(){ 
$("#rfinder_UP").mouseover(function(){ 
    $("#rfinder_UP").hide(); 
    }); 
$("#rfinder_DWN").mouseout(function(){ 
    $("#rfinder_UP").show(); 
    }); 
});

Теперь я хотел бы, чтобы достичь этого, не только скрывает верхнюю DIV с .hide, но как-то вытащить его из left_middle div снизу. Есть простой способ сделать это? Я пробовал множество других эффектов jQuery, таких как анимация, слайд-шоу и т. Д., Но не смог найти рабочего решения.

Заранее благодарен!

Я создал jsFiddle здесь: http://jsfiddle.net/qEcp8/ Красная коробка просто исчезает при наведении, показывающая черный. Я хочу, чтобы красный сместился вниз, из поля left_middle.

источник

2014-02-16 LL1997

Я создал JSFiddle с вашим код [здесь] (http://jsfiddle.net/DLdL8/), но, похоже, это не отправная точка, чтобы помочь вам. Возможно, вы могли бы изменить его, и ваш вопрос будет понятнее. – Reger

Я удаляю позицию fixed и top/left: 0, и это сработало, если я правильно понимаю вашу проблему. Когда я надвигаюсь. он исчезает, и когда я снова опускаю вниз, он показывает. –

Это работает, когда я просто позволяю ему появляться и исчезает. Я пытаюсь добиться того, что это работает с анимацией, которая тянет верхний div вниз и из родительского div. – LL1997

$("#rfinder_UP").hover(function() { 

    $('#rfinder_DWN').animate({height:"100%"}); 
}, function() { 
    $('#rfinder_DWN').animate({height:"0"}); 

} 
);

DEMO: http://jsfiddle.net/EyVd6/1/

Пожалуйста, проверьте весь код, я изменил свой HTML и CSS соответственно ...

источник

2014-02-16 22:01:03 sinisake

Попробуйте это:

#rfinder_UP:hover { 
    display:none; 
}

источник

2014-02-16 21:46:12

К сожалению, никто не оживляет выгорания и не работает! http://jsfiddle.net/2UGLC/ – LL1997

jQuery pull div из родительского div

ответ

Смежные вопросы