Efeito .animate independente

[Pedro Henrique_167255 0]

Ola pessoal to tentando faze um efeito apenas para estudo que pode ser visto aqui:
https://dl.dropbox.com/u/22618831/jquery.html

aonde ao passar o mouse em cima de uma class ele sobe uma outra mais eu queria que cada uma fosse independente da outro pois ai nesse link vc coloca o mouse sobre uma class ele sobe todas queria que cada um fosse independente da outro sem utilizar div

Código javascript:

 

<script type="text/javascript">
$(document).ready(function() {
	$('#pai').mouseenter(function(){
			$('#filho').animate({
				"top": "-200"}, 300);					 
	});
	$('#pai').mouseleave(function(){
		$('#filho').animate({"top": "-400"}, "slow");						
								
	});
	
	$('.capa').mouseenter(function(){
		$('.menuCapa').animate({"top": "-200"}, "slow");						   
	}).mouseleave(function(){
		$('.menuCapa').animate({"top": "0"}, "slow");	
	});
});


</script>

 

 

 

[Vinicius Rangel 208]

cade o html?

[Pedro Henrique_167255 0]

cade o html?

<div class="capa">
	<img src="img.jpg" />
    
    <div class="menuCapa">
    
    </div>
</div>

<div class="capa">
	<img src="img.jpg" />
    
    <div class="menuCapa">
    
    </div>
</div>

<div class="capa">
	<img src="img.jpg" />
    
    <div class="menuCapa">
    
    </div>
</div>

<div class="capa">
	<img src="img.jpg" />
    
    <div class="menuCapa">
    
    </div>
</div>

[Vinicius Rangel 208]

tenta assim:

 

 

$('.capa').mouseenter(function(){
var obj = $(this);
$(obj+' .menuCapa').animate({"top": "-200"}, "slow");   
}).mouseleave(function(){
$('.menuCapa').animate({"top": "0"}, "slow");
});

[Pedro Henrique_167255 0]

 

tenta assim:

 

 

$('.capa').mouseenter(function(){
var obj = $(this);
$(obj+' .menuCapa').animate({"top": "-200"}, "slow");   
}).mouseleave(function(){
$('.menuCapa').animate({"top": "0"}, "slow");
});

 

não funcionou pode ate ver no link: https://dl.dropbox.com/u/22618831/jquery.html

[Vinicius Rangel 208]

deve ter um jeito melhor de fazer isso, mas sem dúvida isso aqui funciona:

 

 

$('.capa').mouseenter(function(){
var obj = $(this);
$(obj).find('.menuCapa').animate({"top": "-200"}, "slow");   
}).mouseleave(function(){
$('.menuCapa').animate({"top": "0"}, "slow");
});

[Pedro Henrique_167255 0]

 

deve ter um jeito melhor de fazer isso, mas sem dúvida isso aqui funciona:

 

 

$('.capa').mouseenter(function(){
var obj = $(this);
$(obj).find('.menuCapa').animate({"top": "-200"}, "slow");   
}).mouseleave(function(){
$('.menuCapa').animate({"top": "0"}, "slow");
});

 

agora sim Obrigado :yes: vc falo que tem uma forma mais fácil se poder dizer como eu agradeço

[Vinicius Rangel 208]

não mas fácil pra você e sim para a máquina, mas agora nem to conseguindo pensar mas é algo parecido com a primeira tentativa.. depois mando

[Pedro Henrique_167255 0]

não mas fácil pra você e sim para a máquina, mas agora nem to conseguindo pensar mas é algo parecido com a primeira tentativa.. depois mando

 

Ok Muito obrigado