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 serán revisados a veces. No te olvides que soy una persona, no se trata de faltar al respeto, todos tenemos opiniones, no hay que enojarse.

Puedes marcar Notificarme para recibir la notificación de la respuesta.

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.

    ResponderBorrar
  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.

    ResponderBorrar
  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

    ResponderBorrar
  4. Pronto publicaré un tutorial al respecto

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

    Gracias y saludos!

    ResponderBorrar

El ascenso de Skywalker(2019)

Joker 2019Una película que ha roto a divido a los fans muchos culparán a sus director por querer reparar Los últimos Jedi, no es su culpa al final.

[Leer artículo...]

La Espada del Inmortal (2019

Blade of The Immortal (2019)La historia de Manji, un guerrero samurái sin señor que ha sido condenado con la inmortalidad...

[Leer artículo...]

Kemono Michi: Rise Up (2019)

Kemono Michi: Rise Up (2019)Del autor de Konosuba, Genzo Shibata es un luchador japonés que es transportado a un mundo de fantasía, quien está obsesionado con los seres peludos.

[Leer artículo...]

ELI (2019)de Netflix

ELI (2019)de Netflix Reseña y criticaPelícula lanzada directo a video que nos cuenta una historia que parecería sacada de la Dimensión desconocida.

[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.