* Bing COVID Widget

Board Stats

  • stats Total de Usuarios: 24004
  • stats Total de Mensajes: 106108
  • stats Total de Temas: 10015
  • stats Total de Categorías: 15
  • stats Total de Foros: 74
  • stats Máx. usuarios conectados (simultáneamente): 1945

Ultimo registro


Autor Tema: Imagenes + enlaces cada x segundos  (Leído 12153 veces)

0 Usuarios y 1 Visitante están viendo este tema.

Desconectado lampi

  • Master
  • Usuario
  • ******
  • Mensajes: 115
  • Fundador del foro (d.e.p)
    • lampiweb.com
Imagenes + enlaces cada x segundos
« en: Enero 25, 2012, 13:49:16 pm »
Lo que quiero hacer es que la imagen que se visualiza es ese momente tenga su link y al pulsar no envie donde sea.

Puedes verlo funcionando abajo en el lateral "Music" pero falta el tema de los enlaces, por el foro alguno comento que sabia bastante...

Código: [Seleccionar]
    <script>
    function rotar_imagen(){
      var tiempo = 1000;//tiempo en milisegundos
      var arrImagenes = ['http://img75.xooimage.com/files/a/7/9/ahfm-2e7e7db.jpg','http://img66.xooimage.com/files/8/7/8/rs-2e7e7f8.jpg', 'http://img163..us/img163/5048/sensej.jpg','http://img269..us/img269/2292/trancesonic.jpg','http://img75.xooimage.com/files/0/1/f/onair-2e7e81b.jpg'];
     
      _img = document.getElementById('rotativo');
     
      //cargar la 1er imagen
      _img.src = arrImagenes[0];
      var i=1;
      setInterval(function(){
        _img.src = arrImagenes[i];
        i = (i == arrImagenes.length-1)? 0 : (i+1);
      }, tiempo);
    }
    </script>

    <body onload="rotar_imagen();"><img id="rotativo"  /></body>
« Última modificación: Enero 25, 2012, 13:53:55 pm por lampi »

Conectado maripuri

  • Master
  • Usuario
  • ******
  • Mensajes: 23455
  • Mari
    • WirelessWindows
Re:Imagenes + enlaces cada x segundos
« Respuesta #1 en: Enero 25, 2012, 20:46:10 pm »
A ver si sacas algo de aquí, de esto estoy pez   :-\

Código: [Seleccionar]
<script language="JavaScript">

enlace = new Array()


enlace[0] = '<a href="http://www.biomanantial.com/algas-marinas-a-852.html"Target="_blank"><img src="http://www.kavewall.com/mariine/images/IMG0034.jpg" height="200" width="200"/></a>'

enlace[1] = '<a href="http://www.asturnatura.com/fauna/moluscos-caracoles-marinos/1.html" Target="_blank"><img src="http://www.kavewall.com/mariine/images/IMG0020.jpg" height="200" width="200" /></a>'

enlace[2] = '<a href="http://www.acuariomarino.com.ar/es/corales.html"target="_blank"><img src="http://www.kavewall.com/mariine/images/IMG0042.jpg" height="200" width="200"/></a>'

enlace[3] = '<a href="http://www.acuariomarino.com.ar/es/estrellas-de-mar.html" Target="_blank"><img src="http://www.kavewall.com/mariine/images/IMG0054.jpg" height="200" width="200"/></a>'


aleatorio = Math.random() * (enlace.length)

aleatorio = Math.floor(aleatorio)

document.write(enlace[aleatorio])

</script>
Sorry, you are not allowed to see this part of the text. Por favor ingresa o regístrate.
 
Sorry, you are not allowed to see this part of the text. Por favor ingresa o regístrate.
No preguntes sobre temas del foro por privado, participa en el.

Desconectado salvarito

  • Usuario
  • *
  • Mensajes: 91
Re:Imagenes + enlaces cada x segundos
« Respuesta #2 en: Enero 25, 2012, 22:24:31 pm »
Haber, que no logro entenderte.

Lo que quieres es en la columna de la izquierda, tener un espacio, donde apareceria una imagen con su respectivo link y que cambie cada x segundos?

Si es asi creo que puedo buscar algo por mi disco duro de los tiempos en los que le daba al html y creo que algo parecito tengo, pero necesito saber si es eso o es otra cosa.

El script que nos propone maripuri lo que hace es tener 4 imagenes con sus respectivos enlaces y que al RECARGAR la pagina aleatoriamente sale una imagen u otra, por lo tanto no parece que sea lo que se busca.

Haber si entre esta noche y mañana busco algo.

Conectado maripuri

  • Master
  • Usuario
  • ******
  • Mensajes: 23455
  • Mari
    • WirelessWindows
Re:Imagenes + enlaces cada x segundos
« Respuesta #3 en: Enero 25, 2012, 22:39:20 pm »
Creo que es eso salvarito, si bajas la pag hacia music verás que la última imagen está rotando.. pues cuando se vea la imagen X y se pulse en ella nos lleve hasta la dirección del link que contenga.. lo mismo para la siguiente y así sucesivamente.

Es lo que yo entiendo.

Se que en el script que comenté hay que recargar la pag, pero lo puse por si daba una idea acerca de las imágenes y sus links, como digo no se nada acerca de esto.
Sorry, you are not allowed to see this part of the text. Por favor ingresa o regístrate.
 
Sorry, you are not allowed to see this part of the text. Por favor ingresa o regístrate.
No preguntes sobre temas del foro por privado, participa en el.

Desconectado lampi

  • Master
  • Usuario
  • ******
  • Mensajes: 115
  • Fundador del foro (d.e.p)
    • lampiweb.com
Re:Imagenes + enlaces cada x segundos
« Respuesta #4 en: Enero 25, 2012, 22:49:48 pm »
Añadiendo esto en negrita mandariamos todas la imagenes a una misma url, podeis probarlo abajo en music.

Seria crear una variable con los link y, estoy probando...

<body onload="rotar_imagen();"><a href="://url" target="_blank"><img id="rotativo"  />

Desconectado salvarito

  • Usuario
  • *
  • Mensajes: 91
Re:Imagenes + enlaces cada x segundos
« Respuesta #5 en: Enero 25, 2012, 22:59:52 pm »
Mas o menos asi?, aun no estan todos los banners incluidos

Código: [Seleccionar]
<script>
//creo array de imágenes
array_imagen = new Array(4)
array_imagen[0] = new Image(150,100)
array_imagen[0].src = "http://img75.xooimage.com/files/a/7/9/ahfm-2e7e7db.jpg"
array_imagen[1] = new Image(150,100)
array_imagen[1].src = "http://img66.xooimage.com/files/8/7/8/rs-2e7e7f8.jpg"
array_imagen[2] = new Image(150,100)
array_imagen[2].src = "http://img163..us/img163/5048/sensej.jpg"
array_imagen[3] = new Image(150,100)
array_imagen[3].src = "http://img269..us/img269/2292/trancesonic.jpg"

//creo el array de URLs
array_url = new Array(4)
array_url[0] = "http://forum.ah.fm/"
array_url[1] = "http://www.radioseven.se/"
array_url[2] = "http://www.sense.fm/"
array_url[3] = "http://www.trancesonic.fm/"

//variable para llevar la cuenta de la imagen siguiente
contador = 0

//función para rotar el banner
function alternar_banner(){
    window.document["banner"].src = array_imagen[contador].src
    window.document.links[0].href = array_url[contador]
    contador ++
    contador = contador % array_imagen.length
    setTimeout("alternar_banner()",2500)
} </script>

Desconectado lampi

  • Master
  • Usuario
  • ******
  • Mensajes: 115
  • Fundador del foro (d.e.p)
    • lampiweb.com
Re:Imagenes + enlaces cada x segundos
« Respuesta #6 en: Enero 25, 2012, 23:03:17 pm »
En ese script no veo ninguna imagen.

VMcaballeronegro

  • Visitante
Re:Imagenes + enlaces cada x segundos
« Respuesta #7 en: Enero 25, 2012, 23:42:54 pm »
Aver que yo me aclare.. tambien.. tu lo que quieres es lo siguiente no?


imagen con un enlace debajo de la imagen pero luego uqieres que cada X segundos se actualize la imagen y salga otra imagen distinta con otro enlace distinto es eso? lo que quieres?¿

Desconectado salvarito

  • Usuario
  • *
  • Mensajes: 91
Re:Imagenes + enlaces cada x segundos
« Respuesta #8 en: Enero 26, 2012, 06:50:57 am »
Código: [Seleccionar]
<html>
<head>
    <title>Rotación de banners con Javascript</title>
<script>
//creo array de imágenes
array_imagen = new Array(4)
array_imagen[0] = new Image(150,100)
array_imagen[0].src = "http://img75.xooimage.com/files/a/7/9/ahfm-2e7e7db.jpg"
array_imagen[1] = new Image(150,100)
array_imagen[1].src = "http://img66.xooimage.com/files/8/7/8/rs-2e7e7f8.jpg"
array_imagen[2] = new Image(150,100)
array_imagen[2].src = "http://img163..us/img163/5048/sensej.jpg"
array_imagen[3] = new Image(150,100)
array_imagen[3].src = "http://img269..us/img269/2292/trancesonic.jpg"

//creo el array de URLs
array_url = new Array(4)
array_url[0] = "http://forum.ah.fm/"
array_url[1] = "http://www.radioseven.se/"
array_url[2] = "http://www.sense.fm/"
array_url[3] = "http://www.trancesonic.fm/"

//variable para llevar la cuenta de la imagen siguiente
contador = 0

//función para rotar el banner
function alternar_banner(){
    window.document["banner"].src = array_imagen[contador].src
    window.document.links[0].href = array_url[contador]
    contador ++
    contador = contador % array_imagen.length
    setTimeout("alternar_banner()",2500)
} </script>
</head>

<body onload="alternar_banner()">

<a href="#"><img src="#" name="banner" width=150 height=100 border=0></a>

</body>
</html>

Guarda eso como por ejemplo index.html y te saldra cambiando cada 2,5 segundos de imagen con su respectivo enlace.

Desconectado lampi

  • Master
  • Usuario
  • ******
  • Mensajes: 115
  • Fundador del foro (d.e.p)
    • lampiweb.com
Re:Imagenes + enlaces cada x segundos
« Respuesta #9 en: Enero 26, 2012, 08:53:36 am »
Perfecto, gracias. En un html funciona bien.
Luego lo meto en un bloque del foro.

Dentro del bloque no me sirve, pilla la url del foro en para todas las imagenes.
« Última modificación: Enero 26, 2012, 13:00:32 pm por lampi »

Desconectado salvarito

  • Usuario
  • *
  • Mensajes: 91
Re:Imagenes + enlaces cada x segundos
« Respuesta #10 en: Enero 26, 2012, 20:35:54 pm »
Dentro del bloque no me sirve, pilla la url del foro en para todas las imagenes.

No entiendo lo que me quieres decir. Si es que hay que ponerle el link de las imagenes alojadas desde dentro del foro o es otra cosa.

Tambien existe la opcion de en la zona donde deseas crear ese espacio de 150x100 pixeles para esos banners poner:
Código: [Seleccionar]
<iframe name="I1" src="banners.htm" marginwidth="1" marginheight="1" height="100" width="150" scrolling="no" border="0" frameborder="0">
El explorador no admite los marcos flotantes o no está configurado actualmente para mostrarlos.
</iframe>

y esto otro:
Código: [Seleccionar]
<html>
<head>
    <title>Rotación de banners con Javascript</title>
<script>
//creo array de imágenes
array_imagen = new Array(4)
array_imagen[0] = new Image(150,100)
array_imagen[0].src = "http://img75.xooimage.com/files/a/7/9/ahfm-2e7e7db.jpg"
array_imagen[1] = new Image(150,100)
array_imagen[1].src = "http://img66.xooimage.com/files/8/7/8/rs-2e7e7f8.jpg"
array_imagen[2] = new Image(150,100)
array_imagen[2].src = "http://img163..us/img163/5048/sensej.jpg"
array_imagen[3] = new Image(150,100)
array_imagen[3].src = "http://img269..us/img269/2292/trancesonic.jpg"

//creo el array de URLs
array_url = new Array(4)
array_url[0] = "http://forum.ah.fm/"
array_url[1] = "http://www.radioseven.se/"
array_url[2] = "http://www.sense.fm/"
array_url[3] = "http://www.trancesonic.fm/"

//variable para llevar la cuenta de la imagen siguiente
contador = 0

//función para rotar el banner
function alternar_banner(){
    window.document["banner"].src = array_imagen[contador].src
    window.document.links[0].href = array_url[contador]
    contador ++
    contador = contador % array_imagen.length
    setTimeout("alternar_banner()",2500)
} </script>
</head>

<body onload="alternar_banner()">

<a href="#"><img src="#" name="banner" width=150 height=100 border=0></a>

</body>
</html>

Lo grabas en la misma direccion donde esta el foro. Lo grabas como banner.htm

Seguro que hay soluciones mejores, pero es lo unico que dan mis escasos conocimientos sobre el tema.

saludos.

Desconectado lampi

  • Master
  • Usuario
  • ******
  • Mensajes: 115
  • Fundador del foro (d.e.p)
    • lampiweb.com
Re:Imagenes + enlaces cada x segundos
« Respuesta #11 en: Enero 26, 2012, 20:48:09 pm »
Funciona correctamente y si lo meto en un iframe tambien, el problema es al meter directamente el codigo en un bloque del portal, el portal funciona por bloques y cada bloque tiene un codigo pero este codigo no acaba de cuajar por lo de las url,  :D lo dejare unos dias que asiente bien.  ::) eso dicen algunos de linux.


Se puede pasar una variable aqui con algo.

<a href="array_url" target="_blank"><img id="rotativo"  />
« Última modificación: Enero 26, 2012, 20:51:37 pm por lampi »

Desconectado lampi

  • Master
  • Usuario
  • ******
  • Mensajes: 115
  • Fundador del foro (d.e.p)
    • lampiweb.com
Re:Imagenes + enlaces cada x segundos
« Respuesta #12 en: Mayo 31, 2012, 16:47:00 pm »
Prentendo que los 3 banners de arriba se muestren en una posicion aleatoria pero sin ser repetidos. Algun experto en el tema que apoye a la causa.  :D

Ahora estan asi,

Código: [Seleccionar]
<a href="http://www.wifi-online.es" target="_blank"><img src="http://img62.xooimage.com/files/5/c/f/wifi-online-27932d3.gif" width="92%"></a>

<a href="http://muchowifi.com" target="_blank"><img src="http://img83.xooimage.com/files/9/0/1/bannerlampiweb-32bf701.gif" width="92%"></a>

<a href="http://www.lafactoriawifi.com" target="_blank"><img src="http://img63.xooimage.com/files/f/6/0/lafactoriawifi-27932c4.gif" width="92%"></a>

Desconectado erborricobueno

  • Grupo de trabajo
  • Usuario
  • *****
  • Mensajes: 2163
Re:Imagenes + enlaces cada x segundos
« Respuesta #13 en: Junio 01, 2012, 18:45:41 pm »
Por si algo vale.-

Sorry, you are not allowed to see this part of the text. Por favor ingresa o regístrate.

Sorry, you are not allowed to see this part of the text. Por favor ingresa o regístrate.

Sorry, you are not allowed to see this part of the text. Por favor ingresa o regístrate.

Sorry, you are not allowed to see this part of the text. Por favor ingresa o regístrate.

Sorry, you are not allowed to see this part of the text. Por favor ingresa o regístrate.

Desconectado lampi

  • Master
  • Usuario
  • ******
  • Mensajes: 115
  • Fundador del foro (d.e.p)
    • lampiweb.com
Re:Imagenes + enlaces cada x segundos
« Respuesta #14 en: Junio 01, 2012, 22:37:19 pm »
Gracias, lo comentaba por si algunos de los que saben podia montar el script.