Utilizamos cookies propias y de terceros para mejorar la experiencia de navegación, y ofrecer contenidos y publicidad de interés.
Al continuar con la navegación entendemos que se acepta nuestra política de cookies.
Iniciar sesión Cerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta

Código de JQuery - Listado en modo pijama

Titulo:local

Listado en modo pijama

Autor:xavi (prog1000@hotmail.com)
Lenguaje:JQuery
Código que muestra como cambiar el color de fondo de un listado en modo pijama (dos colores).
Comentarios: 0 Comentar Recomendar

<html> <head> <title>each del core de jQuery</title> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> /* Una vez se haya cargado el DOM */ $(document).ready(function(){ /* Indicamos a todas etiquetas <p> que tengan un padding de 5px*/ $("p").css("padding","5px"); /* Realizamos un bucle por todas las etiquetas <p> que hay dentro del <div> listado */ $("p", "#listado").each(function(i){ /* i, contiene el indice de la etiqueta <p> dentro del <div> listado*/ if(i%2==0){ $(this).css("background-color", "#808080"); }else{ $(this).css("background-color", "#008080"); } }); }); </script> </head> <body> <p>Esta linea esta fuera del id "listado", por lo que no se cambia el color del fondo</p> <div id='listado'> <p>primera linea</p> <p>segunda linea</p> <p>tercera linea</p> <p>quarta linea</p> <p>quinta linea</p> </div> <p>Esta linea esta fuera del id "listado", por lo que no se cambia el color del fondo</p> </body> </html>