Fondo de Tabla Aleatorio, por favor

terrariomania · #1 (**permalink**) 13/12/2005, 13:49

Por favor, necesito ayuda.

Llevo todo el día intentando encontrar la forma de que el fondo de una Tabla de Disposición sea aleatorio, es decir, en cada carga de la página sea uno distinto de los que yo le prefije.

He encontrado dos post, uno en castellano de este foro y otro en ingles, pero no consigo que lo que pone me funcione. Lo cambio de sitio, le vario cosas... estoy desesperado por que no sé de códigos. Para mi es como chino y me cuesta mucho avanzar.

Mi página es:

http://personal.telefonica.terra.es/...diaz/index.htm

Mi código tiene la tabla:

<DIV align=center>
<CENTER>
<TABLE id=BANNER style="BORDER-COLLAPSE: collapse" borderColor=D38B00
height=123 cellSpacing=0 cellPadding=0 width=700 border=0 background="../nuevojuanmadiaz/logos/banner1.jpg">
<TBODY>
...
...

Por favor, ayudenme, llevo desde las 4 de la tarde y no avanzo.

Mil gracias.

Cap.Buscapina · #2 (**permalink**) 14/12/2005, 10:14

robalo:

Cita:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento sin título</title>
<script>
img=new Array();
img[0]="fondo.gif";
img[1]="fondo_cc.gif";
img[2]="fondo_xx.jpg";

function fondo(){
cual=Math.floor(Math.random()*(img.length))
document.getElementById('fondo').style.backgroundI mage="url("+img[cual]+")";
}

</script></head>

<body onload="fondo()">
<table id="fondo" width="100" border="1" align="center">
<tr>
<td> </td>
</tr>
<tr>
<td > </td>
</tr>
<tr>
<td> </td>
</tr>
</table>
</body>
</html>

terrariomania · #3 (**permalink**) 15/12/2005, 12:17

Uff, pues con este no he conseguido nada aún, pero un compañero o compañera (el nick es muy raro...) me ha mandado algo que parece que casi me funciona bien.

Digo casi por que no sé porque se me abren algunas imágenes (fondos) repetidas, es decir en lugar de alternarse con otra sale dos veces seguidas, otras imágenes no se abren nunca (tengo 9 fondos y solo veo que aparezcan 5), y a veces no se carga ninguna quedando en blanco el supuesto fondo. No lo entiendo.

Creo que gracias a ustedes he logrado un gran paso, por favor, solo un empujoncito más.

Pongo el código que tengo ahora y la dirección del site:

<TABLE id=BANNER style="BORDER-COLLAPSE: collapse" borderColor=D38B00
height=100 cellSpacing=0 cellPadding=0 width=700 border=0>
<TBODY>
<script>

var backgr1="logos/banner1.jpg"
var backgr2="logos/banner2.jpg"
var backgr3="logos/banner3.jpg"
var backgr4="logos/banner4.jpg"
var backgr5="logos/banner5.jpg"
var backgr1="logos/banner6.jpg"
var backgr1="logos/banner7.jpg"
var backgr1="logos/banner8.jpg"
var backgr1="logos/banner9.jpg"

var cur=Math.round(6*Math.random())
if (cur<=1)
backgr=backgr1
else if (cur<=2)
backgr=backgr2
else if (cur<=3)
backgr=backgr3
else if (cur<=4)
backgr=backgr4
else if (cur<=5)
backgr=backgr5
else if (cur<=6)
backgr=backgr6
else if (cur<=7)
backgr=backgr7
else if (cur<=8)
backgr=backgr8
else if (cur<=9)
backgr=backgr9
document.write('<table border=0 background="'+backgr+'" width=700 height=123>')
</script>
<TR>
<TD .......
.......
.....

Dirección: http://personal.telefonica.terra.es/...piadeindex.htm

Muchas gracias Cap.Buscapina y seguiré estudiando tu código para lograr saber como me funcionaría, soy un inutil con códigos.

Cap.Buscapina · #4 (**permalink**) 15/12/2005, 15:37

hola, de tu codigo algo que creo que no esta bien es:

Cita:

var backgr1="logos/banner1.jpg"
var backgr2="logos/banner2.jpg"
var backgr3="logos/banner3.jpg"
var backgr4="logos/banner4.jpg"
var backgr5="logos/banner5.jpg"
var backgr6="logos/banner6.jpg"
var backgr7="logos/banner7.jpg"
var backgr8="logos/banner8.jpg"
var backgr9="logos/banner9.jpg"

del que yo te pasé , 2 cosas:

1 - no te genera la tabla, sino que a tu tabla, ponele el id="fondo"

2 - esta linea:

Cita:

document.getElementById('fondo').style.backgroundI mage="url("+img[cual]+")";

tiene unerror que jenera este foro que donde dice backgroundImage va todo junto.

probalo y me decis.
chau

terrariomania · #5 (**permalink**) 15/12/2005, 16:27

Creo que lo he conseguido hacer funcionar. Me queda (en negrita el código y cambios que este conlleva):
........
........
<script>
img=new Array();
img[0]="logos/banner1.jpg";
img[1]="logos/banner2.jpg";
img[2]="logos/banner3.jpg";

function fondo(){
cual=Math.floor(Math.random()*(img.length))
document.getElementById('fondo').style.backgroundI mage="url("+img[cual]+")";
}

</script>
</head>

<body bgcolor="#FFFFFF" background="fondos/gecko.jpg" bgproperties="fixed" onLoad="fondo('botones/geckos1.jpg','botones/sobremi1.jpg','botones/miscelanea1.jpg','botones/compa%F1eros1.jpg','botones/fotografias1.jpg','botones/contacto1.jpg','botones/culebras1.jpg','botones/otrosanimales1.jpg','botones/disponible1.jpg')">
<meta http-equiv="imagetoolbar" content="no">
<DIV align=center>
<CENTER>
<TABLE id="fondo" .....
......
......

Respecto al otro código, es cierto, jejeje, vaya error garrafal el mio eh? jejee.

De todos modos en ambos casos me ocurre igual y es que no se cargan las imágenes en orden sino que se puede cargar la misma repetidamente y otra no cargarse nunca en cambio. Hay algún fallo o el código no permite que se haga de modo ordenado: imagen1 - imagen2 - imagen3 - ... - ...

Muchas gracias amigo por tu ayuda.

Cap.Buscapina · #6 (**permalink**) 15/12/2005, 16:52

bueno, es que vos pedias Aleatorias, o sea sin orden alguno.

si lo queres ordenado veré que puedo hacer.

saludos

terrariomania · #7 (**permalink**) 16/12/2005, 06:58

Ah, perdón. Tienes toda la razón del mundo. Si no se pudiera en un orden estricto me gustaría lograr almenos que se abriesen todas las que le defina, no sé porque solo me habre algunas.

Muchas gracias y siento estas equivocaciones mías.

Cap.Buscapina · #8 (**permalink**) 16/12/2005, 14:51

Cita:

Si no se pudiera en un orden estricto me gustaría lograr almenos que se abriesen todas las que le defina, no sé porque solo me habre algunas.

Si no interpeto mal, no tenes la posibilidad de utilizar un lenguaje del lado del servidor(php,asp,..) por lo que no se puede saber cual abrió antes(al menos no se me ocurre).

Lo único que me parece podría servirte es utilizar Cookies para guardar en la máquina del usuario que fondo vió por última vez , y así cuando ingrese nuevamente, pase al segundo de la lista, y luego el tercero y así .....

investigalo, no debe ser tan complicado.

saludos

Cap.Buscapina · #9 (**permalink**) 16/12/2005, 16:26

probalo:

Cita:

chau

terrariomania · #10 (**permalink**) 16/12/2005, 17:54

Pues parece que funciona perfecto.

Como lo has hecho? jejeje

que es esto? Sat,01-Jan-2050 00:00:01 GMT

Mil gracias, no sabes lo que me has ayudado, de veras.

Un abrazo compañero.

El site para que lo veas:

http://personal.telefonica.terra.es/...diaz/index.htm

Iré seleccionando fondos y creando nuevos. No me gustan los que quedan muy amarillos ¿no? jijiijij

Cap.Buscapina · #11 (**permalink**) 16/12/2005, 18:08

Cita:

Iniciado por terrariomania

que es esto? Sat,01-Jan-2050 00:00:01 GMT

como te comentaba anteriormente, con cookies podés lograr que los fondos no se repitan y se carguen todos.
Lo de la fecha es para que cuando el navegador se cierra estas cookies se guarden para una nueva sesion.(de lo contrario no cumplirían con el propósito)
Lo que faltaría probar es que pasaría si el usuario tiene las cookies deshabilitadas??.(aunque la mayoría si las utiliza)
Puede que otro forero tenga una solución mejos.

saludos

terrariomania · #12 (**permalink**) 17/12/2005, 02:18

Muy interesante, no tenía ni idea de que eran estas cosas.

Espero que si tienen las cockis estas desabilitadas aparezaca algún fondo como mínimo, jejee.

Saludos y muchisissisisimas gracias.

terrariomania · #13 (**permalink**) 17/12/2005, 05:24

Ahora me surge la duda de si se podría hacer algo similar pero con el fondo de la página en lugar del fondo de una tabla. quizas el mismo código pero modificado sirva?

Salud.

Cap.Buscapina · #14 (**permalink**) 17/12/2005, 09:45

probá sustituir esta linea

Cita:

document.getElementById('fondo').style.backgroundI mage="url("+img[fondo]+")"

por esta otra:

Cita:

document.body.background=img[fondo]

aunque no lo he probado, creo que podría funcionar.

suerte.

PD: Por lo de las cookies desabilitadas, quien las haya desabilitado, creo que simpre mostrará el primer fondo.(pero claro, habría que probarlo)

terrariomania · #15 (**permalink**) 17/12/2005, 11:26

Quieres decir que añada esto tras el script de antes (el de los fondos de la Tabla de Disposición):

<script>
img=new Array();
img[0]="fondos/fondo1.jpg";
img[1]="fondos/fondo2.jpg";
img[2]="fondos/fondo3.jpg";
img[3]="fondos/fondo4.jpg";
img[4]="fondos/fondo5.jpg";
img[5]="fondos/fondo6.jpg";
img[6]="fondos/fondo7.jpg";
img[7]="fondos/fondo8.jpg";
img[8]="fondos/fondo9.jpg";

function fondo(){
cook=document.cookie;
eval(cook);
if (!fondo){
document.cookie="fondo=0;expires=Sat,01-Jan-2050 00:00:01 GMT";
var fondo=0;
}
fondo=(fondo==img.length-1)?0:parseInt(fondo)+1;
document.cookie="fondo="+fondo+";expires=Sat,01-Jan-2050 00:00:01 GMT";
document.getElementById('fondo').style.backgroundI mage="url("+img[fondo]+")"
}

</script>

Es decir, dos script diferentes: uno para el fondo de la página y otro para el fondo de la Tabla.

He añadido ese código y no me va, no sé si es que hay que cmbiarle algo más.

En mi código tengo:

<body bgcolor="#FFFFFF" background="fondos/fondo1.jpg" bgproperties="fixed" .........

Detremina el fondo que aparecerá. He probado con background="fondos/fondo1.jpg" y sin él y nada.

Cap.Buscapina · #16 (**permalink**) 17/12/2005, 15:50

si no entiendo mal:

querés que por un lado se cambie el fondo de una tabla y además se cambie el fondo de la página, todo esto solamente cuando se recarge la página.

si es así probá con:

Código HTML:

<script>
img=new Array();
img[0]="i1.jpg";
img[1]="i2.jpg";
img[2]="i3.jpg";

fpag=new Array();
fpag[0]="f1.jpg";
fpag[1]="f2.jpg";
fpag[2]="f3.jpg";
fpag[3]="f4.jpg";
fpag[4]="f5.jpg";

function fondo(){
cook=document.cookie;
eval(cook);
if (bg==null || fondo==null){
document.cookie="bg=0;expires=Sat,01-Jan-2050 00:00:01 GMT";
document.cookie="fondo=0;expires=Sat,01-Jan-2050 00:00:01 GMT";
var fondo=0;
var bg=0;
}
fondo=(fondo==img.length-1)?0:fondo+1;
bg=(bg==fpag.length-1)?0:bg+1;
document.cookie="bg="+bg+";expires=Sat,01-Jan-2050 00:00:01 GMT";
document.cookie="fondo="+fondo+";expires=Sat,01-Jan-2050 00:00:01 GMT";
document.getElementById('fondo').style.backgroundImage="url("+img[fondo]+")"
document.body.background=fpag[bg];
}

</script>

pd: solo es ete código (repetirlo dos veses no creo que ande) y en el body no definas ninguna imagen de fondo (claro que si podes definir algun color)

probalo

pd2:
lo que está en rojo no creo que sea necesario

Cita:

onLoad="fondo('botones/geckos1.jpg','botones/sobremi1.jpg','botones/miscelanea1.jpg','botones/compa%F1eros1.jpg','botones/fotografias1.jpg','botones/contacto1.jpg','botones/culebras1.jpg','botones/otrosanimales1.jpg','botones/disponible1.jpg')

terrariomania · #17 (**permalink**) 17/12/2005, 17:38

Che!!!

Vos sabés que sos un genio? Pos lo sos, quedó regenial viste? jejejee.

En serio amigo. Parece que funciona de maravilla. Eres un mago por lo visto.

Lo cambio en los codes y mañana lo cuelgo para que lo veas. Al final tendrás que darme tu nombre para meterte en agradecimientos y mandarte un jamón por navidad, jejeje.

Un abrazo amigo.

Cap.Buscapina · #18 (**permalink**) 17/12/2005, 20:52

a, que no te lo había dicho antes....

cobro 100 dólares la hora

hablando en serio, si querés que se vayan alternando el fondo con la tabla, trata de definir distinta cantidades de imágenes para cada fondo (por ejemplo 5 para la tabla y 7 para la pagina) así se van alternando . (bueno, esa es mi idea, por supuesto que eso queda en tus manos).

Condo yo necesite ayuda , no dudaré en pedirtela.

saludos

terrariomania · #19 (**permalink**) 18/12/2005, 03:45

A ver si te refieres a esto más o menos. Meto otra serie en cada uno y así no coinciden los fondos de página con los de la tabla. Por cierto, no has visto los de la página, no tienen nada que ver con los de la tabla, son animales independientes.

Mira:

img[0]="logos/banner1.jpg";
img[1]="logos/banner2.jpg";
img[2]="logos/banner3.jpg";
img[3]="logos/banner4.jpg";
img[4]="logos/banner5.jpg";
img[5]="logos/banner6.jpg";
img[6]="logos/banner7.jpg";
img[7]="logos/banner8.jpg";
img[8]="logos/banner9.jpg";
img[9]="logos/banner6.jpg";
img[10]="logos/banner3.jpg";
img[11]="logos/banner5.jpg";
img[12]="logos/banner1.jpg";
img[13]="logos/banner4.jpg";
img[14]="logos/banner2.jpg";
img[15]="logos/banner9.jpg";
img[16]="logos/banner8.jpg";
img[17]="logos/banner7.jpg";

fpag=new Array();
fpag[0]="fondos/fondo1.jpg";
fpag[1]="fondos/fondo2.jpg";
fpag[2]="fondos/fondo3.jpg";
fpag[3]="fondos/fondo4.jpg";
fpag[4]="fondos/fondo5.jpg";
fpag[5]="fondos/fondo6.jpg";
fpag[6]="fondos/fondo3.jpg";
fpag[7]="fondos/fondo1.jpg";
fpag[8]="fondos/fondo4.jpg";
fpag[9]="fondos/fondo2.jpg";
fpag[10]="fondos/fondo5.jpg";

De javas y códigos no creo que te pueda ayudar pero si necesitas algo de diseño puedo intentar ayudarte. Y por supuesto si quieres información de reptiles soy tu hombre, ejjejee.

P.D. mira el resultado compañero:

http://personal.telefonica.terra.es/...diaz/index.htm

Cap.Buscapina · #20 (**permalink**) 18/12/2005, 07:01

hola,

Cita:

A ver si te refieres a esto más o menos. Meto otra serie en cada uno y así no coinciden los fondos de página con los de la tabla.

si lo querés así no interfiere en nada, bastaría conque tenga 1 imagen más que el otro array.

Lo que no comprendo es las imágenes del tipo fondos/fondo1.jpg que son de gran tamaño, donde aparecen, ya que no las veo en ningún lado(las que tienen tu firma y un bichito abajo a la derecha).

terrariomania · #21 (**permalink**) 18/12/2005, 09:59

Cita:

Iniciado por Cap.Buscapina

bastaría conque tenga 1 imagen más que el otro array.

Es verdad!!! Gracias!!!

Cita:

Iniciado por Cap.Buscapina

Lo que no comprendo es las imágenes del tipo fondos/fondo1.jpg que son de gran tamaño, donde aparecen, ya que no las veo en ningún lado(las que tienen tu firma y un bichito abajo a la derecha).

No sé si te entiendo bien. Las imágenes fondos/fondo1.jpg etc son los fondos de la página, y en el site solo se ven representadas por el animal de turno en la esquina inferior derecha. En el centro tienen también el logo del web pero claro, aparece tapado por los contenidos.

Mira: http://personal.telefonica.terra.es/...dos/fondo1.jpg

no sé si he explicado tu duda... jeje.