1 Background Aleatorio cada vez que se actualiza Miér Dic 26, 2012 12:01 am
Ayax
esto es bien simple, si quieren pueden ver esta pagina y recargarla (viendo el fondo) http://htmlbiohazard.webmaster-foro.com/h8-
si se dan cuenta el fondo cambia cada vez que la recargamos, y la imagen que esta al centro tambien, en este caso enseñare a hacer los dos, es bastante facil, para esto se usa javascript
el codigo basico es este
solo se cambia lo que esta destacado, ya sea subrayado,color o en negrita, eso es solo para el fondo, si se dan cuenta está "documente.write", donde se puede escribir HTML y aplicar las cosas del javascript que estan arriba de eso.
entonces, como hago un logo cambiante?
bueno es bien simple, obviamente se tiene que poner el logo donde se quiera, ya sea arriba, abajo, al centro, recuerden que se puede mover con css position (fixed,absolute,relative).
el código que usé yo en el link que dí más arriba es este
si se dan cuenta marqué con cyan ".frontimage" que es el class que le dí yo a mi imagen
y le di lo que puse en el javascript que es "vol" y el "ta" y los , las que quiero que vallan variando
y algo muy importante si se dan cuenta las imágenes terminan en el número 14, pero pusé 15 en lo otro, porqué? porque empieza en el 0 lo que es importante hacerlo porque o si no, no funcionaría y 14 + 1 número que es el 0 dá 15 y por eso se pone 15.
creo que no me expliqué lo más bien que pude
Cualquier cosa, llegan y copian el código, luego cambian el URL de la imagen o el color.
Tutorial de mi foro
si se dan cuenta el fondo cambia cada vez que la recargamos, y la imagen que esta al centro tambien, en este caso enseñare a hacer los dos, es bastante facil, para esto se usa javascript
el codigo basico es este
var back = new Array();
back[0] = '#343752';
back[1] = '#3C8FC9';
var bio = Math.round(Math.random()*2);
document.write( '');
solo se cambia lo que esta destacado, ya sea subrayado,color o en negrita, eso es solo para el fondo, si se dan cuenta está "documente.write", donde se puede escribir HTML y aplicar las cosas del javascript que estan arriba de eso.
entonces, como hago un logo cambiante?
bueno es bien simple, obviamente se tiene que poner el logo donde se quiera, ya sea arriba, abajo, al centro, recuerden que se puede mover con css position (fixed,absolute,relative).
el código que usé yo en el link que dí más arriba es este
- Código:
var vol = new Array();
vol[0] = 'http://i42.servimg.com/u/f42/15/92/96/93/dubai10.jpg';
vol[1] = 'http://i42.servimg.com/u/f42/15/92/96/93/burj-a10.jpg';
vol[2] = 'http://i42.servimg.com/u/f42/15/92/96/93/la-des11.jpg';
vol[3] = 'http://i42.servimg.com/u/f42/15/92/96/93/unmemo10.jpg';
vol[4] = 'http://i42.servimg.com/u/f42/15/92/96/93/jumeir10.jpg';
vol[5] = 'http://i42.servimg.com/u/f42/15/92/96/93/18ce9610.jpg';
vol[6] = 'http://i42.servimg.com/u/f42/15/92/96/93/marina10.jpg';
vol[7] = 'http://i32.servimg.com/u/f32/15/92/96/93/26829710.jpg';
vol[8] = 'http://i32.servimg.com/u/f32/15/92/96/93/56067010.jpg';
vol[9] = 'http://i32.servimg.com/u/f32/15/92/96/93/38317110.jpg';
vol[10] = 'http://i32.servimg.com/u/f32/15/92/96/93/31568910.jpg';
vol[11] = 'http://i32.servimg.com/u/f32/15/92/96/93/30515810.jpg';
vol[12] = 'http://i32.servimg.com/u/f32/15/92/96/93/37683710.jpg';
vol[13] = 'http://i32.servimg.com/u/f32/15/92/96/93/42822510.jpg';
vol[14] = 'http://i32.servimg.com/u/f32/15/92/96/93/37568810.jpg';
var ta = Math.round(Math.random()*15);
document.write( '<style type="text/css">' );
document.write('.frontimage{');
document.write('background-image: url('+vol[ta]+') !important;');
document.write('background-color: rgba(255,255,255,.6);');
document.write('}');
document.write('</style>');
// -->
</script>
si se dan cuenta marqué con cyan ".frontimage" que es el class que le dí yo a mi imagen
- Código:
<img src="URL DE LA IMAGEN" class="frontimage" />
y le di lo que puse en el javascript que es "vol" y el "ta" y los , las que quiero que vallan variando
y algo muy importante si se dan cuenta las imágenes terminan en el número 14, pero pusé 15 en lo otro, porqué? porque empieza en el 0 lo que es importante hacerlo porque o si no, no funcionaría y 14 + 1 número que es el 0 dá 15 y por eso se pone 15.
creo que no me expliqué lo más bien que pude
Cualquier cosa, llegan y copian el código, luego cambian el URL de la imagen o el color.
Tutorial de mi foro
Última edición por Ayax el Vie Dic 28, 2012 1:17 am, editado 2 veces