Hola,

Es mi primer tutorial así que no me castigueis mucho jeje.

Os voy a explicar como poner en el portal (ó por ej en el texto de la cabecera ó el pie), dos tipos de rotadores de imágenes.

SCRIPT ROTADOR DE IMÁGENES nº1

Con este script, las imágenes se rotan cada un tiempo determinado por nosotros.

El script es:

<script language="JavaScript1.1">

var specifyimage=new Array() //Your images

specifyimage[0] ="URL DE LA IMAGEN 0"

specifyimage[1] ="URL DE LA IMAGEN 1"

specifyimage[2] ="URL DE LA IMAGEN 2"

specifyimage[ultimo numero]= "URL DE LA IMAGEN ULTIMA”

var delay=5000 //
//Counter for array
var count =1;
var cubeimage=new Array()
for (i=0;i<specifyimage.length;i++){
cubeimage[i]=new Image()
cubeimage[i].src=specifyimage[Math.floor(Math.random() * specifyimage.length)]
}

function movecube(){
if (window.createPopup)
cube.filters[0].apply()
document.images.cube.src=cubeimage[count].src;
if (window.createPopup)
cube.filters[0].play()
count++;
if (count==cubeimage.length)
count=0;
setTimeout("movecube()",delay)
}

window.onload=new Function("setTimeout('movecube()',delay)")
</script>
<img src="URL DE LA IMAGEN 0 " name="cube" border=0 style="filter:progid:DXImageTransform.Microsoft.Stretch(stretchStyle='PUSH')">

La imagen 0 siempre será la primera que aparece en pantalla. Las siguientes imágenes se mostraran aleatoriamente.

var delay=5000 …… Este número indica en milisegundos (5000 quiere decir 5 segs), el tiempo que permanece fija cada foto antes de rotar.

SCRIPT ROTADOR DE IMÁGENES nº2


Con este script, se rotan las imágenes cada vez que se actualiza la página.

<script language="javascript">
<!--
function VecImagenes()
{
n=0;

this[n++]='<URL DE LA IMAGEN 1>'

this[n++]='<URL DE LA IMAGEN 2>'

this[n++]='<URL DE LA IMAGEN ULTIMA>'

this.N=n;
}
var Imagenes=new VecImagenes();

src= Imagenes[Math.floor(Math.random() * Imagenes.N)];
document.write (src);
//-->

Si en lugar de rotar imágenes queremos rotar banners (ó imagen) con enlaces directos a una web, hay que cambiar los this[n++]= anteriores por los de la siguiente forma:

this[n++]='<a href="http://www.PAGINAWEB/"target="_blank"><img src=”URL DEL BANNER Ó IMAGEN ENLACE"border="0"about:_blank></a>'


Observaciones: Todo lo que está en rojo, se ha de cambiar por vuestros datos.

un saludo,

Muchas gracias, angliru, un tutorial muy interesante y útil.

Un comentario: creo que el código de la primera opción no es completamente correcto. En concreto:


esta parte del código no genera un array completo (con todas las imágenes especificadas) en orden aleatorio, como creo que se pretendía, sino más bien genera una lista de la misma longitud que puede tener imágenes repetidas y pueden faltar otras. No sé si era la intención, pero ese será el comportamiento.

Si se quiere una secuencia aleatoria (sin importar repeticiones y ausencias), entonces mejor poner el random() dentro de la función movecube. Y si se quiere una secuencia completa pero desordenada (todas las imágenes, sin ausencias ni repeticiones), que se repite regularmente en la misma sesión (carga de página), entonces mejor hacerlo donde está, pero corrigiendo este punto.

Por último, si se quiere una secuencia concreta, y siempre la misma, hay que quitar toda la parte de random(), en ambas opciones, y sustituirlo por una secuencia fija.

Después de estas posibles "mejoras" al código, ahora la pregunta: si quiero añadir esto en mi FORO, pero ni tengo ni quiero PORTAL, dónde sería el mejor sitio para hacerlo?

Por ejemplo, se me ocurre para rotar la imagen del foro, dónde se podría hacer? Y en qué otros sitios se podría añadir?

Y otra cosita: el código style="filter:progid:DXImageTransform.Microsoft.Stretch(stretchStyle='PUSH')", es válido en todos los navegadores, o sólo en MSIE? alguna versión específica?

Muchas gracias, de nuevo, por una gran idea y buena aportación!
Saludos,
-javiexin
http://exin.forogratis.es