lunes, 7 de diciembre de 2009

Banner aleatorio con vinculos individuales

Este es el código para hacer un banner aleatorio con vínculos activos para cada banner, los banners aleatorios soportan imágenes, pero si lo desean pueden usar divs y texto o solamente texto.

Para usar este Script que se divide en dos partes, el script entre las etiquetas <head> y  </head> y la llamada javascript que se pone en cualquier elemento dentro de <body> y </body>

Primero pegamos este script antes de la etiqueta </head>
<script language="javascript" type="text/javascript">
<!-- visita cgnauta.blogspot.com -->
var max=3;
var thisCgnautabanner=1;
var Cgnautabanner=new MakeCgnautabannerArray(max);

function MakeCgnautabannerArray(n)
{
this.length=n;
for (var i=1; i<=n;i++)
{
this[i]="";
}
return this;
}
Cgnautabanner[1]='<a href="vinculo1#"><img border="0" src="direccion_imagen_1.jpg" width="468" height="60" alt="descripcion1"\/><\/a>'; /*Cambia la imagen y el vinculo*/
Cgnautabanner[2]='<a href="vinculo2#"><img border="0" src="direccion_imagen_2.jpg" width="468" height="60" alt="descripcion2"\/><\/a>'; /*Cambia la imagen y el vinculo*/
Cgnautabanner[3]='<a href="vinculo3#"><img border="0" src="direccion_imagen_3.jpg" width="468" height="60" alt="descripcion3"\/><\/a>'; /*Cambia la imagen y el vinculo*/

function rand(n)
      {
      rnum=Math.floor(n*Math.random())+1;
      return rnum;
      }

function setCgnautabanner()
      {
      thisCgnautabanner=rand(max);
      } </script>
Aquí tenemos que notar que var max controla el número de banners, si tenemos var max=4 necesitamos el Cgnautabanner[4] y así sucesivamente

En los Cgnautabanner[número]='codigo html' notarán que en el caso de los cierres con barra, aparecen como <\/a> o sea, una diagonal invertida \ y una diagonal /, de no hacerlo así el Javascript dará problemas para imprimir el resultado, pues / es un operador.

Para cambiar el código entre las apostrofes 'codigo' si fuera un div:
<div>texto <a title="" href="tuvinculo.com">vinculo<\/a><\/div>

Así podremos poner Texto en lugar de imágenes.

Ahora falta el script dentro de la tag <body> y </body>, mi recomendación es que la pongan en un div o una celda, el script hará el resto:

<script type="text/javascript" language="JavaScript">
<!--
setCgnautabanner();
document.write (Cgnautabanner[thisCgnautabanner]);
// -->
</script>
Ahora cada vez que cambien o actualicen la página cambiarán automáticamente del banner.

Comentarios y Consultas

Los mensajes son moderados serán revisados antes de publicarse.

Este no es un foro de adolescentes, no uses letras en vez de palabras completas como "q" en vez de "que", ni escribas tus mensajes en mayúsculas, se respetuoso con los demás, si no estás de acuerdo no comentes.

Una cosa es que no te guste una crítica, otra que uses un lenguaje inapropiado para demostrarlo. No me siento en la obligación de publicar ningún mensaje en específico o de leerlo entero si usas palabras altisonantes.

5 comentarios:

  1. Gracias por el tutorial, pero me da un error:

    No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
    Mensaje de error de XML: The content of elements must consist of well-formed character data or markup.

    He copiado los códigos tal y como los pusiste y cambié los links y las imágenes nada mas para probar a poner 2 banners, no se que falla.

    ResponderEliminar
  2. En el caso de Blogger en el primer Script

    Agrega
    //<![CDATA[

    después de la etiqueta <script language="javascript" type="text/javascript">

    y agrega

    //]]>

    antes de </script>

    o sea:
    <script language="javascript" type="text/javascript">
    //<![CDATA[

    --Contenido del Script--

    //]]>
    </script>

    El segundo Script debe ir en los artilugios, no lo metas directamente al código.

    ResponderEliminar
  3. Hola, soy nuevo en esto de los foros.
    Este script me ha funcionado muy bien. Muchas gracias por el aporte.
    Tengo una pregunta. Si quiero que los banners se cambien cada 10 segundos sin cambiar la página, como lo hago?

    Un saludo y felicidade sotra vez por el aporte

    ResponderEliminar
  4. Pronto publicaré un tutorial al respecto

    ResponderEliminar
  5. Me sirvió muy bien y es lo que estaba buscando.

    Gracias y saludos!

    ResponderEliminar

Samurai Jack (2017), episodio 10 "Final"

Samurai Jack (2017)Jack se enfrenta por fin con Aku, todos tratan de ayudar al samurai y la sorpresa vendrá del pasado.

[Leer artículo...]

Noragami entra en paro indefinido

Noragami es suspendida temporalmenteUna de las autoras no puede continuar con su trabajo al frente del manga y se ha decidido meter la historia en hiatus, lo que puede significar...

[Leer artículo...]

Tales of Zestiria y su final Yuri

El final de Tales the Zestiria The XLas aventuras de Sorey llega a su fin con un final de lo más raro que he visto hasta ahora.

[Leer artículo...]

Warau Salesman New (2017) El vendedor sonriente

Warau Salesman New (2017) EstrenosSatoru descubre al culpable de la trama, es el momento de enfrentarse y tendrá que dar todo de sí para cambiar su suerte.

[Leer artículo...]

  © Cgnauta | CGsign blog | [Ver Licencia de uso] | Matius Lenin, Creative Commons, algunos derechos reservados

Regresar ARRIBA  

Vistas desde Mayo 2009

▼/▲ Archivo del Blog

Visitas totales

Información

IBSN: Internet Blog Serial Number 01-77-94-2008

Esta plantilla es creada y diseñada por Matius Lenin para CGnauta blog. Con Scripts de JQuery bajo licencia GNU/GPL. CGnauta es una marca registrada propiedad de Matius Lenin.

Anexos

Bitacoras.com