Fixed / Floating Banner (así de rapido)
Floating banner (algunos le dicen fixed tambien) es cuando tenes una imagen o texto en un sector de tu pagina y por mas que vayas para arriba o para abajo este siempre queda ahí (puede estar arriba de todo, abajo, a la izquierda a la derecha…)
Hoy en dia es muy comun encontrar estos floating banners para linkear la pagina en cuestion con Factbook, Twitter o los RSS. (en blogs se ve mucho)
Bueno, en dos simples pasos les explico como hacerlo.
1-Si tu pagina tiene asociada una hoja de estilos (.css) abrila y pone lo siguiente.
#banner { border: 0;position: fixed; top: 440px; right:0;}
2- Guarda el .css y en la pagina donde queres poner el banner, metete en el codigo y después de <body> pone esto.
<div id=’banner’><a href=’http://(aca va la pagina adonde queres ir al hacer clic en el banner)’ target=’_blank’><img src=’(aca va la ruta de la imagen)’ border=”0″/></a></div>
Configuracion:
En el .css si queres que la barra este a la izquierda, cambia right por left
Donde dice top: 440px significa a cuantos pixeles va a estar el banner desde el inicio de la pagina, si disminus los pixeles por ejemplo 200px va a estar mas arriba…
————————————————————————————————————–
Un ejemplo que hice en la pagina de los www.jubirlados.com
En el .css puse:
#facebook-follow { border: 0;position: fixed; top: 440px; right:0;}
Y despues, en el index.php despues de <body> puse:
<div id=’facebook-follow’><a href=’http://www.facebook.com/group.php?gid=231416822119′ target=’_blank’><img src=’img/facebook_ad.png’ alt=’Add in Facebook’ border=”0″/></a></div>
Y listo.
Sin Comentarios »
RSS feed for comments on this post. TrackBack URL