¿Como puedo seleccionar un elemento perteneciente a una clase de entre muchos otros?

[frandotouro]

¡Hola!

Me gustaría saber esto y no hay nada mejor que explicarlo.

Yo tengo un foro, un foro tipo phpbb y en el existen muchas categorías, el problema es que están creadas a partir de un template que repite la categoría con unas variables por lo que no puedo diferenciarlas.

Ahora el caso es que he visto ya foros que lo han conseguido y que tienen imágenes entre categorías o una categoría con su cabecera de otro color. No se si me explico por lo que creo una imagen.



Espero que me puedan ayudar, tengo conocimientos básicos de jquery, puede que sea algo de este lenguaje.

[_cronos2]

Si te refieres a que uno sea rojo y otro azul, y que vayan alternándose, eso lo puedes lograr con selectores CSS3: odd y even. Creo que jQuery también ofrece estos selectores para navegadores que no soporten CSS3, pero no estoy seguro.
Saludos (:

[Pablo Ayala]

Hola... no se entiende muy bien tu explicación, pero si _cronos2 le atino a lo que intentaste decirnos, la solucion que ofrece _cronos2 con jquery, sería asi:

$('#celebs tbody tr:even').addClass('estilo_que_quieres_aplicar');

Saludos

[Panino5001]

O quizá se refiera a esto:
https://developer.mozilla.org/en/DOM...ntsByClassName
O esto para navegadores que no soporten lo anterior:
http://www.dustindiaz.com/getelementsbyclass

Igualmente, para el problema planteado considero que la mejor opción sería solucionarlo en el servidor y no con javascript.

[frandotouro]

No, no quiero alternar, solo quiero que un foro cualquiera (por ejemplo si existiesen cuatro, el penúltimo) que tenga una forma de identificarlo.

[_cronos2]

También tienes los selectores :first-child, :last-child y :nth-child(n).
Saludos (:

[frandotouro]

¿Me puedes explicar el funcionamiento de :nth-child(n) porfavor y como lo podría poner en marcha en ese ejemplo?

[_cronos2]

:nth-child(n) significa que de todos esos elementos, cogerá el que esté en la posición n. O sea:

Código HTML:

<div class='clase'></div>
<div class='clase'></div>
<div class='clase'><!-- Este div tendrá un fondo azul --></div>
<div class='clase'></div>
 

Código CSS:

.clase:nth-child(3) {
 background:blue;
}
 

Saludos :D
PD: No seas tan impaciente ;)

[frandotouro]

Gracias, ha servido.

[_cronos2]

Para que se vea el fondo tienes que darle un height a los divs o insertarles contenido, si no su height será 0px
Saludos (:
Edit: La última edición decía que no funcionaba, por eso contesté

[frandotouro]

Ah, es que no me funcionaba pero buscando en google encontré uno idéntico y me funcionó (:nth-of-type(2))

[_cronos2]

Que yo sepa es lo mismo que usar :nth-child (en este caso) :nth-of-type ofrece una característica muy potente que te permite pasarle una especia de polinomio (de 1º grado) y selecciona los elementos que lo "cumplen". Aquí lo verás mejor.
Saludos (:

[frandotouro]

Bueno, a lo mejor tuve un problema con el número. De todas formas gracias por avisar, me pondré a probarlo.