Efeitos de opacidade com div filhas

[tevez15]

Boa a tarde..

Estou a desenvolver uma especie de galeria, em que o objectivo e ter varias secções, e quando passo por cima delas, mudar a imagem de fundo.

Está tudo bem, à excessão de que quando para por cima das divs filhas da secção principal, esta coloca opacity:0; na secção:

<div id="section1">
<div class="title">Titulo</div>
<div class="body_section">
Aqui ficaram outras divs para alem destas
</div>
</div>

Depois o JS fica assim:

//script
$("section1").hover(function(){
o bg muda para o correspondente da secção
//anima a section
$("#section1 ").hover(function(){
$("#section1 ").addClass("active"); //nada de especial para o caso
$("#section1 .body_section").attr("style", "opacity:1;"); //porque so o titulo aparece.. ao fazer hover aparece a descrição da secção
$("#section1").attr("style", "opacity:0;"); //como esta sempre visivel, ao passar por cima fica a 0 para fazer o efeito para 1 que se segue
$("#section1").fadeTo(300,1);
});
//fecha script

Atenção estes codigos nao sao os originais, mas sao a parte que interessa para o caso.

Resumindo, se eu andar com o rato por cima da div "section1", tudo bem, caso passe com o rato por cima da div title ou body_section, o codigo enrola e coloca na #section1 opacity:0; voltando de imediato a 1, e assim consecutivamente.

O codigo base e este, depois dentro de casa body_section e gerado por php umas ooutras tantas divs e por ai fora.

Espero que me possam ajudar.

[brunoais]

indenta isso, sff. Não consigo percebê-lo.

[HappyHippyHippo]

a tua pergunta é estranha, não dá para perceber bem qual o teu problema ....

já agora diz o porque disto :

$("#section1").attr("style", "opacity:0;"); // tornar invisível
$("#section1").fadeTo(300,1);               // fade para tornar visível logo a seguir ...