LOG IN
Usuario:

Contraseña:


Últimos temas
» [PHPBB3] Mejorar las Pestañas que aparecen en el perfil de un Usuario.
Dom Jul 01, 2018 12:12 am por Ysamar

» Navbar desplegable sencilla
Dom Jun 17, 2018 2:06 pm por Ysamar

» Modulo de Afiliados 40x40 [Todas las versiones]
Vie Jun 15, 2018 6:44 pm por Ysamar

» 2 Galeria Html Elegante
Miér Jun 13, 2018 8:57 pm por Ysamar

» [PHPBB3]Agregar amigos desde el perfil y dejar mensaje en su muro...
Miér Jun 13, 2018 8:02 pm por Ysamar

» [PHPBB3] Contenido por defecto en la respuesta rapida.
Miér Jun 13, 2018 7:56 pm por Ysamar

» Botón "ir al muro" (mensajes de los visitantes)
Miér Jun 13, 2018 7:49 pm por Ysamar

» ¿No quieres publicidad
Miér Jun 13, 2018 7:37 pm por Ysamar

» Efecto Lightbox automatico en imagenes [Foroactivo]
Miér Jun 13, 2018 7:27 pm por Ysamar

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

Nuestros miembros han publicado un total de 41229 mensajes en 3360 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: https://www.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.