Mil Trucos Bloggers

Tutoriales y recursos para Blogger

Select Menu
  • Home
  • Blogging
    • Tutorial Blogspot
    • CSS
    • jQuery
    • Widget
  • Tools
    • Font Awesome
    • HTML Editor
    • HTML Encrypter
    • Code Color
    • Responsive Cek
  • Sitemap
  • Static Page
  • Error Page
Home » Trucos Blogger » Anuncio flotante con efecto de retraso en Blogger

jueves, 23 de febrero de 2012

Anuncio flotante con efecto de retraso en Blogger

Add Comment
Trucos Blogger
jueves, 23 de febrero de 2012
Hace unos dias puse un anuncio con un curioso efecto de retraso que a muchos lectores les gusto y por eso hoy decido compartilo.
Este truco es genial para cuando tenemos que comunicar un anuncio importante a nuestros lectores y queremos que se muestre en todas las partes del blog.


Para agregar este truco ve a la Edición HTML de tu blog y antes de </head> pega lo siguiente:
 <style type='text/css'>
    #anuncio {
    position: absolute;
    border: 0px;
    width: 250px; /* Ancho del anuncio */
    height: 100px; /* Alto del anuncio */
    visibility: hidden;
    z-index: 200;
    top: 20px;
    margin-top:50px; /* Márgen del borde superior de la pantalla*/
    margin-left: 813px; /* Margen a la izquierda de la pantalla */
    }
    </style>
    <script src='http://dl.dropbox.com/u/35784805/Mil%20Trucos%20Blogger/Anuncio-flotante.js' type='text/javascript'/>
Lo que esta en verde son las condicionales que se pueden editar.

Ahora antes de </body> pega lo siguiente:
<div id='anuncio'>
<div style='background:#A9E2F3;color:#000;border:1px solid #dadada;padding:5px;font-size:14px;'><a href='Javascript:void' onClick='closebar(); return false'><img align='right' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3T4lnAZKNkYdUI7rcZOsIgDPoWQia5Rh926mi_4Ig1U19GQxdOIYo06tZT-swkWIlzc4vQaSEnv8Sd880Vbn432SSQY1VGmz2WvBfP_Yy3zmjdNPBU-Lstka_4-7jevwW2gNzwMXG3B0/s200/icono-cerrar.png'/></a>Aqui va Tu Anuncio</div>
</div>

A continuacion explico algunas condicionales editables del anuncio

background:#A9E2F3: Es el color del fondo del anuncio
color:#000: Es el color de las letras
font-size:14px: Es el tamaño de la letra del anuncio
Aqui va Tu Anuncio: Por el anuncio que quieras poner.

Por ultimo guardan los cambios.Pueden ver el resultado en el siguiente blog de pruebas.

Share

Like

G+

Tweet

Tweet
0 Komentar untuk "Anuncio flotante con efecto de retraso en Blogger"

Add Comments

Entrada más reciente Entrada antigua Página Principal
Suscribirse a: Comentarios de la entrada (Atom)

Popular Week

  • Scroll infinito en Blogger
    Scroll infinito en Blogger
    Una de las nuevas formas de cargar una pagina web o blog, es el scroll infinito , el cual consta en que a medida que se vaya bajando el con...
  • Últimas Entradas Personalizadas con Icono
    Últimas Entradas Personalizadas con Icono
    Hace unos dias publique una entrada titulada  Ultimos Comentarios Personalizados con Icono ,pues bien despues de probar un rato con los codi...
  • Juegos Android- Otro acierto de Google
    Juegos Android- Otro acierto de Google
    Desde que los celulares con el sistema operativo de Google: Android se volvieron muy populares ha crecido en torno a ellos una gran comunida...
  • Pop Up Me gusta de Facebook para Blogger
    Pop Up Me gusta de Facebook para Blogger
    Un usuario anonimo me pidio un truco tipo PopUp en el se mostrase el boton Me Gusta de Facebook,y buscando un poco he encontrado el tutorial...
  • Plantilla BloggerTube
    Plantilla BloggerTube
    BloggerTube es una de las plantillas mas populares entre los Bloggeros en especial para aquellos que desean crear un blog de videos o musica...
  • Corazón volando por el blog
    Corazón volando por el blog
    Ya casi empieza el mes de febrero,el mes del amor y la amistad y como hay mucho bloguero enamorado que mejor forma de expresarlo que decoran...
  • Numerar  los nuevos comentarios anidados en Blogger
    Numerar los nuevos comentarios anidados en Blogger
    Hace un par de dias que Blogger saco a la luz su nuevo formato de comentarios llamado "Comentarios Anidados" y con ellos vinieron ...
  • ¿Blogger es el producto favorito de Google?
    ¿Blogger es el producto favorito de Google?
    ¿Blogger es el producto favorito de Google?, esa es la pregunta que muchos se harán, luego de leer mi post de ayer el cual se titulaba  ¿Blo...
  • Imagen con texto sobrepuesto en Blogger
    Imagen con texto sobrepuesto en Blogger
    En esta oportunidad les traigo un genial truco que consta de una imagen con texto sobrepuesto en Blogger,podras ver el truco en funcionamien...
  • No olvides hacerle SEO a tu web
    No olvides hacerle SEO a tu web
    Ya en Mil Trucos Blogger hemos hablado sobre el SEO, pero hoy hablaremos para que sirve verdaderamente el SEO ya que he recibido muchas duda...

Labels

  • Anuncios Oficiales
  • Comentarios
  • Concursos
  • Consejos
  • Dominios
  • Efectos
  • Feed
  • Festividades
  • Gadgets y Widgets
  • Humor
  • Imágenes
  • Monetiza tu blog
  • Off Topic
  • Plantillas
  • Recomendados
  • Recursos Web
  • Recursos Wordpress
  • Redes Sociales
  • SEO
  • Trucos Blogger
  • Tutoriales Blogger

Blog Archive

  • ►  2014 (20)
    • ►  enero (20)
  • ►  2013 (322)
    • ►  diciembre (34)
    • ►  noviembre (31)
    • ►  octubre (35)
    • ►  septiembre (33)
    • ►  agosto (42)
    • ►  julio (13)
    • ►  junio (17)
    • ►  mayo (26)
    • ►  abril (30)
    • ►  marzo (22)
    • ►  febrero (15)
    • ►  enero (24)
  • ▼  2012 (171)
    • ►  diciembre (19)
    • ►  noviembre (20)
    • ►  octubre (13)
    • ►  septiembre (15)
    • ►  agosto (10)
    • ►  julio (10)
    • ►  junio (8)
    • ►  mayo (15)
    • ►  abril (12)
    • ►  marzo (15)
    • ▼  febrero (19)
      • Elegance Gallery-Plantilla Premium para Blogger
      • Minus-10 GB par almacenar archivos (ampliables a 5...
      • Emoticones para los Comentarios Anidados en Blogger
      • Boton Subir con efecto de Opacidad y Desvanecimiento
      • Anuncio flotante con efecto de retraso en Blogger
      • IntenseDebate:Sistema de Comentarios Estilo Wordpress
      • Uso del Facebook según la edad-Comic
      • Conoce el ranking de tu web
      • Globos que caen y se desvanecen en el blog
      • Si estamos Estrenando nuevo Diseño-No te equivocastes
      • Marcadores Sociales con efecto de Opacidad y TipTip
      • Rosas que caen y se desvanecen en el blog
      • Más Espacios Publicitarios en Mil Trucos Blogger
      • Diary/Notebook-Plantilla Premium para Blogger
      • Emoticones "Smilies Elegant" para Blogger
      • Menú de redes sociales con CSS Sprites
      • Añadele estilo a los comentarios anidados
      • Super Clean-Plantilla Premium para Blogger
      • Blogger comenzará a redirigir los dominios blogspot
    • ►  enero (15)
  • ►  2011 (186)
    • ►  diciembre (20)
    • ►  noviembre (16)
    • ►  octubre (16)
    • ►  septiembre (16)
    • ►  agosto (18)
    • ►  julio (19)
    • ►  junio (22)
    • ►  mayo (25)
    • ►  abril (28)
    • ►  marzo (6)

Labels

  • Anuncios Oficiales
  • Comentarios
  • Concursos
  • Consejos
  • Dominios
  • Efectos
  • Feed
  • Festividades
  • Gadgets y Widgets
  • Humor
  • Imágenes
  • Monetiza tu blog
  • Off Topic
  • Plantillas
  • Recomendados
  • Recursos Web
  • Recursos Wordpress
  • Redes Sociales
  • SEO
  • Trucos Blogger
  • Tutoriales Blogger

Labels

  • Anuncios Oficiales
  • Comentarios
  • Concursos
  • Consejos
  • Dominios
  • Efectos
  • Feed
  • Festividades
  • Gadgets y Widgets
  • Humor
  • Imágenes
  • Monetiza tu blog
  • Off Topic
  • Plantillas
  • Recomendados
  • Recursos Web
  • Recursos Wordpress
  • Redes Sociales
  • SEO
  • Trucos Blogger
  • Tutoriales Blogger

© Mil Trucos Bloggers Published By Kaizen Templates powered by Blogger.com.
All Right Reserved By .