LOG IN
Usuario:

Contraseña:


Estadísticas
Tenemos 2352 miembros registrados.
El último usuario registrado es golfete.

Nuestros miembros han publicado un total de 41213 mensajes en 3358 argumentos.
Afiliados





No estás conectado. Conéctate o registrate

Ver el tema anterior Ver el tema siguiente Ir abajo  Mensaje [Página 1 de 1.]


1 Background Aleatorio cada vez que se actualiza el Miér Dic 26, 2012 12:01 am

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


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

Ver perfil de usuario http://biohazard.webmaster-foro.com

Gracias Ayax por aportar el Tutorial Encantado


- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Mai Tuitah: @ElDelTKM
Mai Youtuf chanel: http://youtube.com/StormMadafaqas
Mai Tuenti: Storm Madafaqas Gfx
Mai Skaip: Madafaqas
Ver perfil de usuario http://www.webdesignforo.net/

Ver el tema anterior Ver el tema siguiente Volver arriba  Mensaje [Página 1 de 1.]

Permisos de este foro:
No puedes responder a temas en este foro.