| Demo | Acabo de implementar en el blog un sistemita de imagenes aleatorias, visto en macuoren, para ir arriba del blog. es muy sencillo de añadir a nuestra pagina web, solo tienes que añadir los siguientes codigos y si quieres cambia las url de las imagenes. |
Este es el codigo para que las imagenes se muestren como aleatorias cada vez que refresques la pagina:
<script language="javascript">
<!--
function VecImagenes()
{
n=0;
this[n++]=”url_imagen_1.gif“;
this[n++]=”url_imagen_2.png“;
this[n++]=”url_imagen_3.png“;
this[n++]=”url_imagen_4.png”
this.N=n;
}
var Imagenes=new VecImagenes();
src= Imagenes[ Math.floor(Math.random() * Imagenes.N) ] ;
document.write(”<IMG SRC=”+src+”>”);
//–>
</script>
Donde url_imagen_4.png se refiere a la ubicacion de la imagen, el nombre y el formato.
Ahora hay que incluir las imagenes en una capa y darle la posicion, en este caso será en la parte inferior derecha, sin olvidar poner el enlace al que queremos que nos lleve la imagen.
<div style="display:scroll; position:fixed; bottom:-4px; right:0px;border:0;">
<a href="#">
<script language="javascript">
<!--
function VecImagenes()
{
n=0;
this[n++]="url_imagen_1.gif";
this[n++]="url_imagen_2.png";
this[n++]="url_imagen_3.png";
this[n++]="url_imagen_4.png"
this.N=n;
}
var Imagenes=new VecImagenes();
src= Imagenes[ Math.floor(Math.random() * Imagenes.N) ] ;
document.write("<IMG SRC="+src+">");
//–>
</script>
</a>
</div>
y eso es todo, aunque al momento de agregarlo a la plantilla blogger me ha dado problemas asi que lo soluciones poniendo el contenido del script en un archivo adjunto a la plantilla y me ha funcionado de maravilla(el enlace al archivo adjunto se coloca en el mismo lugar donde está el script).
El autor del post original ha dejado un sodigo fuente con algunas imagenes que el ha diseñado y es el siguiente:
<div style="display:scroll; position:fixed; bottom:-4px; right:0px;border:0; ">
<a href="#">
<script language=”javascript”>
<!–
function VecImagenes()
{
n=0;
this[n++]="http://media.share.ovi.com/m1/original/0297/4342542a4f1a475ea6a5da4dac4c71e0.gif";
this[n++]="http://farm2.static.flickr.com/1269/887518968_421100aa52_o.png";
this[n++]="http://media.share.ovi.com/m1/original/0313/ae58536641924587bf1459e1ca6324f3.png";
this[n++]="http://media.share.ovi.com/m1/original/0297/49750ac796e843dd99d3974a5431d024.png";
this[n++]="http://media.share.ovi.com/m1/original/0297/7563bcec1d1c485ea671fa9fe617b21b.png";
this[n++]="http://media.share.ovi.com/m1/original/0313/d7df10299864447a8f5d687b86d54f02.png";
this[n++]="http://media.share.ovi.com/m1/original/0313/8ed17fbd23a74513a1ada08d73e25d4c.gif";
this[n++]="http://media.share.ovi.com/m1/original/0313/768f59fa8e344382b1d95d4df5297541.png";
this[n++]="http://media.share.ovi.com/m1/original/0313/265ffca483644e78bea550f677366779.png";
this[n++]="http://media.share.ovi.com/m1/original/0298/47f3b95f9bfe4a12becc24723ae269b0.png";
this[n++]="http://media.share.ovi.com/m1/original/0298/bd669312ccac4e179b454b386d1692a8.png"
this.N=n;
}
var Imagenes=new VecImagenes();
src= Imagenes[ Math.floor(Math.random() * Imagenes.N) ] ;
document.write("<IMG SRC="+src+">");
//–>
</script>
</a>
</div>
Despues de unos minutos este es mi resultado y aunque son pocas comenta si te ha sido de ayuda o de algo te ha servido:) :
Tal vez te interesen algunos iconos
| Demo | Download Source | Download Psd |
27 comentarios
gracias amigo interesante, una cosita donde consigo mas imagenes como esas cuatro que tienes tu de comentarios, estan muy bonitas :D
Posted on 6/23/2009 9:48 p. m.
Hola cargohe las imagenes son hechas a partir de estos emoticones, pero puedes visitar el post original donde el autor nos regala algunas imagenes de otro estilo.
Enlace
si te gustan las cuatro que posteado, con gusto haré un pequeño tutorial para que tu mismo hagas tus propios mensajes. comentame o mandame un mail :)
Posted on 6/23/2009 10:01 p. m.
eii no me habia dado cuenta de que eras colombiano¡
jaja paisano, si quieres editar los mensajes no olvides descargar el archivo psd de las imagenes.
Posted on 6/23/2009 10:11 p. m.
Ok gracias paisano lo descargo :D, Saludos desde la costa :O. Córdoba - Montería.
Posted on 6/28/2009 7:52 a. m.
Gracias a ti cargohe, saludos desde cali - valle :P
Posted on 6/28/2009 8:32 a. m.
Hola, me sale este 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: Open quote is expected for attribute "{1}" associated with an element type "style".
Me puedes ayudar, gracias
Posted on 7/01/2009 1:23 p. m.
Hola Pinon, como comenté en la entrada ese script me causó ese mismo problema al queres agregarlo, asi que lo solucioné copiando y pegando el script en un archivo javascript.
Debería quedar algo asi
<div style='position:fixed; bottom:0; right:5px;'>
<a href='#' >
<script src='http://URL-ARCHIVO/imagenes-aleatorias.js'/>
</a>
</div>
Para que no te compliques puedes bajar y modificar el que yo uso desde esta
direccion...aunque tendrás que esperar un poco ya que el servidor no está disponible en este momento.
Posted on 7/01/2009 1:44 p. m.
Parece que ya se arregló el servidor.
Posted on 7/01/2009 1:45 p. m.
:) Excelente post! No había visto tu blg antes, pero me encanta tu diseño. Impecablemente decorado, y me encantó lo que hicistes con los emoticones aquí en los comentarios :P
Este blog va para bookmark, definitivo!
Que la pases bien, y sludos desde Puerto Rico.
Posted on 7/02/2009 12:37 p. m.
:) Muchas gracias Jessica por tu opinion, me alagas :$
Cualquier cosa que necesites no dudes en preguntar y que tengas un buen fin de semana :P
Posted on 7/02/2009 12:46 p. m.
Hola!
Miguel que fuente usaste para escribir en los globos??
Pero de los primeros onda el de "¿Porque no comentas?!" y esos.
Saludos y Gracias! :P
Posted on 7/06/2009 4:37 p. m.
Hola Sirkan la letra se llama DigitalStrip y puedes descargarla desde aqui.
Saludos :)
Posted on 7/06/2009 6:39 p. m.
Hola Miguel!!
Gracias!!
Ahora la estoy usando para ponerle los mensajes a los iconos.
Gracias y Saludos! :P
Posted on 7/06/2009 6:53 p. m.
No hay de que, ahora mismo estaba haciendo un tutorial en video sobre como hacerlo...solo para practicar y luego hacer algo sobre photoshop.
Posted on 7/06/2009 6:59 p. m.
Mira tu... :O
Yo estaba feliz arreglandolos :), cuando derrepente el photoshop me dice que hay un error con el programa y no puedo agrandar las fuentes :\
Pero igual van bien solo que los signos de exclamación no serán en grande ;(
Pero bueno es lo q hay!
Saludos! :P
Posted on 7/06/2009 7:14 p. m.
Que raro...pero seguro se ven bien :)
Posted on 7/06/2009 7:15 p. m.
Si!! :O
En algún momento de esta semana los empiezo a usar en mi blog :)
Saludos y Gracias! :P
Posted on 7/06/2009 7:34 p. m.
Hola Miguel!
Ya implemente las imagenes, son 8. :O
Hay una distinta a las que tienes en el post! :)
Saludos y gracias! :P
Posted on 7/07/2009 12:24 p. m.
Lo acabo de visitar, esta muy buenas :O
Posted on 7/07/2009 1:09 p. m.
Hola Miguel!
Espero que estes bien, oye te queria preguntar si podia publicar esta entrada en mi blog :D???
Obviamente dando el link original.
Saludos!
Posted on 7/30/2009 1:16 p. m.
Por supuesto que si Sirkan :P
Posted on 7/30/2009 1:35 p. m.
Oka! Gracias!:O
Saludos! :P
Posted on 7/30/2009 1:43 p. m.
Listooo!
Miguel ahora puedes ver como me quedo la entrada :o
Link!
Saludos y Gracias! :P
Posted on 7/30/2009 3:56 p. m.
Esta muy bien Sirkan, no hay de que :)
Posted on 7/30/2009 6:00 p. m.
GRACIAS KARNAL SE VE DE POKA EN MI BLOG....
AUNQ ME QDARON ALGO GRANDE LOS ICONOS PERO ESO E SLO DE MENOS MAÑANA LOS CHEKO....
GRACIAS POR EL DATO...
:D :o :O :P :)
Posted on 7/30/2009 10:29 p. m.
No hay de que Dr4KoN, en la cuestion del tamaño he estado pensando algunos efectos para añadir...vamos a ver que sale :)
Posted on 7/31/2009 4:39 a. m.
heyo wanted to let you all a tip on how you can save some money monthly, Getting a conversion
kit for your vehicle will save you hundreds of dollars on gas by switch to an american made fuel 'Ethonal'.
More americans are upgrading their vehicles to support both fuel types and buying ethonal to fill up your vehicle.
Ethonal is not only an American made fuel, which you'll be support our economy alot more than buying fuel
that we have to import making us more depended on foreign supplies.
Run your vehicle on a [url=http://www.e85kits.info]e85 Conversion kit[/url]
Posted on 8/26/2010 4:32 a. m.
Publicar un comentario en la entrada al viejo estilo