¿Cómo aplicar el mismo efecto a distintos objetos (divs)?

[shiryu]

Hola amigos,
Me gustaría saber cual es la forma adecuada para aplicar un mismo efecto jquery a distintos objetos, en este caso divs.

Código:

$(document).ready(function() {
	$('#capa').hover(function(){
		$('#capa').slideUp();
		//alert(1231);
	});
});

Por ejemplo, qué debería de hacer para aplicar este efecto slideUp a un par de capas distintas.

Código:

<div id="capa" style="width:200px">algo</div>
<div id="capa" style="width:200px">otra cosa</div>

Sé que si al segundo div le llamo "capa2" y en la linea $('#capa')... la voy llamando una a una $('#capa,#capa2')...me funcionaría. Pero si por ejemplo tengo 500 divs a los que quiero aplicar ese efecto, me gustaría saber si hay alguna manera de ahorrarme tener que llamarlos uno por uno.


Saludos

[codek_orz]

Si no me confundo, al igual que en css los id es un único elemento,no puede haber más elementos con el mismo id. Para ello debes usar clases. Un saludo espero haberte ayudado

[alexg88]

En vez de utilizar el id, utiliza class. Pones la misma class a todos los divs que quieras que tengan ese efecto y en vez de poner el selector #capa, pones .capa.

[shiryu]

Perfecto! gracias por contestar.
Efectivamente utilizar la clase es la solución que necesitaba.

El código quedaría así:

Código:

$(document).ready(function() {
	$('.clasecapa').hover(function(){
		$(this).slideUp();
	});
});

Código:

<div id="capa1" class="clasecapa" style="width:200px">algo</div>
<div id="capa2" class="clasecapa" style="width:200px">otra cosa</div>

[DrFaust]

Las clases son la herramienta principal para hacer lo que querés. +1 a alexg88.

Además, acordate de que jQuery permite elegir varios elementos con un solo query:

$(".boton, #carritodecompras, #comprar").hover(function() {

[alexg88]

+1 para codek_orz, que ha dado la misma respuesta antes que yo.

Sólo quería completar un poco su respuesta.