|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Regístrate para
recibir el boletín de
e-Contento.com. Ya somos 4356 suscriptores. [+]
|
|
Listado de Artículos |
|
|
Citas aleatorias con JavaScript
|
En este artículo vemos como insertar distintos elementos aleatoriamente. Hemos elegido el ejemplo de citas de personajes famosos de la historia, pero la idea se puede extrapolar fácilmente a diferentes imágenes y a otros elementos, y hacer que así, el contenido de nuestra web se vuelva más dinámico. Suele ser interesante que cada vez que entremos a una home, esta muestre algunos elementos diferentes. |
|
En este ejemplo, queremos que al cargar una página se muestre una cita diferente de un personaje famoso. Esto mismo podría hacerse respondiendo a distintos eventos: al cargar la página, al hacer click en cierto enlace, o al pasar el ratón por encima de determinado sitio.
En este caso vamos a hacer el ejemplo más simple, que es que al cargarse la página se escriba una frase aleatoria. Más sencillo imposible.
Lo primero que vamos a hacer es almacenar frases en un vector de JavaScript del estilo de cita[i] = ["texto","autor"]:
cita = new Array();
cita[0] = ["Educar no es... ","William B. Yeats"];
cita[1] = ["El principal...","Albert Einstein"];
cita[2] = ["La finalidad...","Bertold Brecht"];
...
Ahora lo que tenemos que hacer es elegir aleatoriamente una cita y escribirla.
function escribirCita(){
long = cita.length;
numeroAleatorio = Math.floor(Math.random()*long);
txt = cita[numeroAleatorio][0];
if (cita[numeroAleatorio][1]!=""){
txt +=" (" + cita[numeroAleatorio][1] + ")\n";
}
document.write(txt)
}
Bien, ya tenemos la función que elige la cita aleatoriamente y la escribe en la página. El código es muy sencillo de entender. Ahora, cuando llamemos a esa función, escribirá una cita.
Te puedes bajar el código completo del ejemplo.
ejemplo
|
volver |
|
|
|
|
|
MIS FOTOS... |
|
CITA |
|
Si con frecuencia añades poco a lo poco, llegarás a lo mucho Hesiodo
|
|
El matrimonio es la principal causa de divorcio.
Julius Marx (Groucho)
|
|