Blogroll fácil | Oloblogger O como poner una marquesina con nuestros enlaces favoritos, imágenes, texto, etc. Se trata de usar...

24 de enero de 2008

Blogroll fácil

O como poner una marquesina con nuestros enlaces favoritos, imágenes, texto, etc.

Se trata de usar la etiqueta marquee para incluir dentro los elementos html que queramos. Esta instrucción muestra un recuadro y lo que se coloca dentro de él, se muestra haciendo un scroll (desplazamiento). En este caso se ha configurado hacia arriba.

Además hemos añadido un onmouseover para detener el scroll cuando se pase el puntero por encima del contenido y un onmouseout para restaurarlo. Este sería el resultado:


Dentro puedes escribir un simple texto que irá desplazándose como éste,

una colección de imágenes como éstas:





o incluso enlaces:

Cosicas
Olografias
Olojuegos


<table align="center" width="200" height="200" border=2><tr><td><marquee onmouseout="this.start()" direction="up" height="200" onmouseover="this.stop()" scrollamount="2">
Dentro puedes escribir un simple texto que irá desplazándose como éste,

una colección de imágenes como éstas:

<img src="http://4.bp.blogspot.com/_0eC4K-qZ7AM/R5IsXtHlpEI/AAAAAAAACcg/0UQsC-3Sqio/s1600/JUANITO-3.png" width="150" />
<img src="http://3.bp.blogspot.com/_0eC4K-qZ7AM/Rz3FeQaSdHI/AAAAAAAAB8Q/Ytw5p2yoP8k/s1600/milagros.jpg" width="150" />
<img src="http://1.bp.blogspot.com/_0eC4K-qZ7AM/Rxtq1OinvNI/AAAAAAAABvQ/7FsOD_g4v9M/s1600/ANTONIO-PNG-B1.png" width="150" />

o incluso enlaces:

<a href="http://oloman-cosicas.blogspot.com/">Cosicas</a>
<a href="http://olografias.blogspot.com/">Olografias</a>
<a href="http://olojuegos.blogspot.com/">Olojuegos</a>
</marquee></td></tr></table>


La instrucción marquee no es totalmente compatible con Firefox. Habrá que hacer pruebas según lo que queramos. Por ejemplo, para regular el ancho para IE, sólo hace falta ponerlo como atributo en el propio marquee. Sin embargo, para Firefox, hay que colocarlo dentro de una etiqueta adicional style, tal y como se ve en el código del ejemplo. El efecto scroll también varía de un navegador a otro.

¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.

Compartir
Copy URL

Y muchos más artículos interesantes si nos sigues en...

follow us in feedly

17 comentarios :

  1. Holaaaa!!!

    Siempre sorprendiendome con tus trucos maravillosos, tu blogg, cada dia mas bonito, felicidades.

    Saludos

    ResponderEliminar
  2. Gracias Denise. La verdad es que ya hago pocas modificaciones en la plantilla, porque casi, casi está ya a mi gusto.

    Al tuyo le he echado un vistazo y he comprobado que también lo has modificado bastante. Supongo que también estarás cerca de conseguir el mismo objetivo.

    Un saludo

    ResponderEliminar
  3. Anónimo2/9/09 22:19

    Hola!!
    Mi pregunta en concreto es saber si puedo agregar un "background con imagen" y como lo declararia...


    Muchas Gracias Oloman

    ResponderEliminar
  4. Ya está puesto un fondo-imagen.

    Tienes que añadir a la etiqueta TABLE un atributo STYLE con el fondo:

    <table width="200" style="background:url(DIRECCION_IMAGEN);" align="center"... ETC.

    ResponderEliminar
  5. Hola Oloman, otra vez. Mi pregunta es la siguiente: se puede hacer esta marquesina con las imagenes de un album de picassa? Ahora mismo tengo una presentación de imágenes de un album picassa, pero me gustaría pasarlo a una marquesina en hornizontal debajo de la cabecera.
    Un saludo!

    ResponderEliminar
  6. también me gustaría que las imágenes pasaran continuamente, sin ninguna interrupción (osea, que cuando pase la última imagen, pegada a continuación pase la primera. Y por último que, cuando se cargue la página, no se vea el hueco del gadget en blanco, sino que aparezcan las imagenes ya moviéndose.
    No se si me explico bien ni si serán posibles todas estas cosas.
    UN SALUDO!

    ResponderEliminar
  7. Contestada la pregunta con un post de hoy Moblelar...

    ResponderEliminar
  8. Genial!
    tan sencillo y tan útil!

    ResponderEliminar
  9. Hola!!
    ¿y para cambiarle el tipo de letra y el color como haria?
    xD
    un saludo

    ResponderEliminar
  10. Ani, igual que en el comentario #5, incluyendo una etiqueta STYLE. En tu caso con un font-family:loquesea;color:#xxxxxx; (el que sea también)

    ResponderEliminar
  11. Hola de nuevo :(
    Despues de darle muchas vueltas a la cabeza he decidido usar este sistema para poner todos mis afiliados, lo he probado en mi blog de prueba primero y me pasa lo siguiente. Que cuando la primera imagen llega arriba impediatamente vuelve a empezar y no pasan el resto de imagenes...¿como puedo solucionarlo? o si me puedes dar tu un consejillo para poder poner todos los afiliados juntos, ya que los quiero quitar de los laterales de mi blog....
    gracias por tener tanta paciencia con los que no sabemos tanto de esto...
    saludos

    ResponderEliminar
  12. Ani, no te comas mucho el coco con esto que no sé por qué, pero unas veces funciona bien y otras no.

    A ver si te sirviera este otro truco que funciona perfectamente.

    ResponderEliminar
  13. Hola oloman, no encuentro, en tu sitio la solucion para la pregunta de como hacer para que el blogroll las imagenes pasaran continuamente sin el espacio, cual es el post?
    ah y otra pregunta, donde consigo un buscador interno que tome en cuenta los tags, saludos

    ResponderEliminar
  14. Edgar, no sé a qué espacio te refieres y sobre lo del buscador interno, no conozco ningún buscador que haga eso.

    ResponderEliminar
  15. Hola gracias por la respuesta Oloman, me refiero a lo mismo que te pregunto moblebar, pregunta 7, cuando va pasando la informacion en el blogroll, pasa la ultima información y luego se interrumpe y vuelve a comenzar, si no hay un truco para que pasaran seguidas, la ultima pegada de la primera.

    saludos


    excelente blog

    ResponderEliminar
  16. Como también contesto por otro lado, lo de MARQUEE no funciona del todo bien. Por ahí leí que no era un stándar.
    La alternativa que di está explicada en esta otra entrada:
    http://oloblogger.blogspot.com/2009/09/imagenes-rotativas.html

    De momento no tengo otra.

    ResponderEliminar
  17. gracias Oloman, eso buscaba precisamente. aqui he resuelto todas mis dudas.

    saludos

    ResponderEliminar