Foros del Web » Creando para Internet » HTML »

background aleatorio escalable!

Estas en el tema de background aleatorio escalable! en el foro de HTML en Foros del Web. Hola, buenas a todos. Soy un novato en esto de las paginas web y necesito ayuda para crear lo que tengo en mente. Tengo una ...
  #1 (permalink)  
Antiguo 25/08/2012, 18:23
 
Fecha de Ingreso: agosto-2012
Mensajes: 8
Antigüedad: 12 años, 3 meses
Puntos: 0
background aleatorio escalable!

Hola, buenas a todos. Soy un novato en esto de las paginas web y necesito ayuda para crear lo que tengo en mente.

Tengo una web la cual su fondo o background es aleatorio, entre varias imagenes, usando este script:

<script type="text/javascript">
var banner= new Array()
banner[0]="images/metaleros.jpg"
banner[1]="images/metaleros2.jpg"
banner[2]="images/metaleros3.jpg"
banner[3]="images/metaleros4.jpg"
banner[4]="images/metaleros5.jpg"
banner[5]="images/metaleros6.jpg"
var random=Math.floor(5*Math.random());
document.write("<style>");
document.write("body {");
document.write(' background: #000000 url("' + banner[random] + '") no-repeat; background-attachment:absolute;heigth=100%; width=100%;');

document.write(" }");
document.write("</style>");
</script>

pero me salta un problema, y es que al ser fotos de una determinada medida no se ven iguales en todas las pantallas, por ejemplo, en mi pantalla portatil se ve perfecta, pero en la pantalla de mi pc de mesa se ve repitiendose en el eje X, y a mi novia se le ve repitiendose en el X aun mas.

Mi pregunta es la siguiente, Hay alguna forma de hacer que esa imagen aleatoria que se ve de background se escale al tamaño de la pantalla?

he visto que para escalar proponen cosas como hacerlo con una capa que este por debajo de todo lo demas y que sea absoluta, pero no encuentro la forma que sea aleatoria la imagen de esta capa, asi que no me sirve esta forma a no ser que me digais como meter imagenes aleatorias ahi...

Gracias por vuestra ayuda y espero haberme explicado bien.
  #2 (permalink)  
Antiguo 26/08/2012, 01:04
 
Fecha de Ingreso: julio-2009
Mensajes: 74
Antigüedad: 15 años, 4 meses
Puntos: 5
Respuesta: background aleatorio escalable!

Saludos Javirizos, yo encontre algo que te podria servir implementando jquery
mira la siguiente web y descarga los archivos disponibles....

http://iamjpg.github.com/jQuery-Ez-Background-Resize/

Aun no he tenido la oportunidad de usarlo en alguno de mis proyectos pero ya baje los archivos y aparte de ver la ventaja de tener un fondo escalable, viene un html con ejemplo de fondos en random que te podria ser de utilidad.

Analizalo para ver si te es util, saludos.
  #3 (permalink)  
Antiguo 26/08/2012, 09:20
 
Fecha de Ingreso: agosto-2012
Mensajes: 8
Antigüedad: 12 años, 3 meses
Puntos: 0
Respuesta: background aleatorio escalable!

muchas gracias por el consejo, pero no se porque no me lo reconoce, simplemente me deja en blanco el fondo y no me pone ninguna foto... lo que creo que me falla es esto del reescalable:

<script>
$(document).ready(function() {
$("body").ezBgResize({
img : "images/metaleros3.jpg", // Relative path example. You could also use an absolute url (http://...).
opacity : 0, // Opacity. 1 = 100%. This is optional.
center : true // Boolean (true or false). This is optional. Default is true.
});
});
</script>

esta copiado tal como viene, solo que le he cambiado la foto... pero no hay forma :S

gracias por los consejos :)

Edito:

Muchas gracias por todo, por fin he conseguido que funcione, el problema era que se ve que entraba en conflicto con otro .js que ponia... ahora toca revisar todos a ver cual era el que modificaba el fondo.

gracias cstudio por la ayuda :D

Última edición por javirizos; 26/08/2012 a las 10:07

Etiquetas: imagenes, aleatoria, formulario, fondo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:02.