no se si la idea es utilizar texto html o no, podrias utilizar css sprite si te sirve una imagen con texto http://css-tricks.com/css-sprites/
o utilizar la propiedad css content en el hover http://www.librosweb.es/referencia/css/content.html No lo he probado pero supongo que funcionará El 21 de enero de 2011 00:53, German Bustos <ger...@atarraya.org> escribió: > Hola, > > Quiero hacer lo siguiente: Sobre un banner quiero que al pasar el ratón > aparezca un texto y al quitar el ratón desaparezca de nuevo. Parece un > asunto muy sencillo pero no logro que funcione en todos los navegadores. > Como de costumbre en Firefox, Chrome, Safari y Opera funciona como lo > deseo, > pero en Internet Explorer 9, no. Ni siquiera he probado en IE6 debe ser un > desastre. > > Hice varias pruebas con diversas estrategias, probé con Javascript, pero > creo que no se justifica usar un scrit para una cosa tan sencilla. > Inicialmente intenté usar la propiedad "visibility", poniéndola en "hidden" > cuando está afuera y en "visible" con el ratón encima, pero no funcionó, > creo yo que al estar oculto (hidden) el elemento no pasa nada cuando se le > ratón encima. Así que consideré otras opciones y elegí cambiar la opacidad. > > El código que tengo es el siguiente: > > HTML > > <div class="completa"> > <div id="capa1"> > <img src='imagen.jpg' width='968' height='150' > style='height:150px;width:968px;' /> > <div id="capa2"> > <a href="/" target="_top">Titulo</a> > </div> > </div> > </div> > > > CSS: > > .completa, { > width: 968px; > overflow: hidden; > float: none; > clear: both; > margin: 0; > padding: 0; > } > > #capa1{ > position:relative; > width:968px; > height:150px; > overflow: hidden; > z-index: 3; > } > #capa2 a, #capa2 a:link, #capa2 a:visited{ > position:absolute; > width:918px; > height:150px; > line-height: 150px; > padding-right: 50px; > text-align: right; > top: 0; > left: 0; > color:#FFF; > font-family: Arial, sanserif; > font-size: 3.5em; > z-index: 10; > opacity: .01; > filter: alpha(opacity=1%); > } > #capa2 a:hover, #capa2 a:Active{ > opacity: .9; > filter: alpha(opacity=95%); > text-shadow: 0 0 20px #111; > } > > > -- > > *Germán Bustos* > Asesor en estrategias de comunicación en Internet para organizaciones > sociales > http://atarraya.org > http://germanbustos.com > Tel: (+57) 3177381339 > <http://atarraya.org/> > <http://germanbustos.com/> > <http://www.facebook.com/german.bustos> > <http://twitter.com/kommodin> > <http://www.linkedin.com/in/germanbustos> > _______________________________________________ > Lista de distribución Ovillo > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > http://lists.ovillo.org/mailman/listinfo/ovillo > -- Eliseo Benavent Diseño web y Publicidad www.pompagrafica.es www.guiamislata.com 699 818 798 En cumplimiento de la Ley Orgánica de Protección de Datos 15/1999, le informamos que sus datos personales están incorporados en un fichero cuyo responsable es Eliseo Benavent Gimeno , pudiendo ser utilizados con fines informativos. Si lo desea puede ejercer los derechos de acceso, rectificación, cancelación u oposición de sus datos personales en el correo electrónico tecn...@pompagrafica.es _______________________________________________ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
