Germán, agregaste las propiedades display:block; y width:100%; a las anclas?
Porque a mi se me ve bien en Opera e IE.
Un abrazo.
Plácido.
El 21 de enero de 2011 17:49, German Bustos <ger...@atarraya.org> escribió:
> Plácido,
>
> Muchas gracias, ese era truco, funcionó casi perfecto en todos los
> browsers,
> Incluso (según el IEtester) en Internet Explorer 5, aunque en el 6 el texto
> queda siempre visible, en el 5 se oculta como quiero. También en IE 7, 8 y
> 9, todo con el IE tester que a veces no es 100% seguro, pero es una buena
> aproximación de cómo funcionaría.
>
> En Firefox, Chrome y Safari tengo el funcionamiento que quería, no importa
> por que parte del banner pase el ratón, siempre se hace visible el texto.
> En
> Opera e IE solo se hace visible cuando paso encima del texto en sí que es
> un
> área relativamente pequeña con respecto al total de banner, creo que le voy
> a poner enlace también a la imagen para solucionar.
>
> La otra solución sería usar JavaScript, con lo que tengo menos experiencia
> y
> no me siento tan confiado.
>
>
> Muchas gracias Plácido,
>
>
> Germán
>
>
>
> El 21 de enero de 2011 14:20, Plácido Luna <octubre196...@gmail.com
> >escribió:
>
> > Perdón, donde puse
> >
> > #capa2 a:hover, #capa2 a:Active{
> > display:block;
> > width:100%;
> > opacity: .1;
> > filter: alpha(opacity=100);
> >
> > text-shadow: 0 0 20px #111;
> > background-color:#333;
> > }
> >
> > debió ser
> >
> > #capa2 a:hover, #capa2 a:Active{
> > display:block;
> > width:100%;
> > opacity: 1;
> > filter: alpha(opacity=100);
> >
> > text-shadow: 0 0 20px #111;
> > background-color:#333;
> > }
> >
> > Saludos!
> >
> >
> > El 21 de enero de 2011 17:18, Plácido Luna <octubre196...@gmail.com
> > >escribió:
> >
> > > Germán, no uses el signo de % para la opacidad en IE, prueba con esto:
> > >
> > > <html>
> > > <head>
> > > <style>
> > >
> > > .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{
> > > display:block;
> > > width:100%;
> > > position:absolute;
> > >
> > > 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: .1;
> > > filter: alpha(opacity=10);
> > > background-color:#333;
> > >
> > > }
> > > #capa2 a:hover, #capa2 a:Active{
> > > display:block;
> > > width:100%;
> > > opacity: .1;
> > > filter: alpha(opacity=100);
> > >
> > > text-shadow: 0 0 20px #111;
> > > background-color:#333;
> > > }
> > > </style>
> > > </head>
> > > <body>
> > >
> > > <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>
> > > </body>
> > > </html>
> > >
> > > Saludos!
> > > Plácido.
> > >
> > > El 20 de enero de 2011 21: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
> > >>
> > >
> > >
> > >
> > > --
> > > *Plácido Luna*
> > > http://www.octubre.com.uy
> > > (+598) 99 942723
> > >
> > >
> >
> >
> > --
> > *Plácido Luna*
> > http://www.octubre.com.uy
> > (+598) 99 942723
> > _______________________________________________
> > 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
> >
>
>
>
> --
>
> *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
>
--
*Plácido Luna*
http://www.octubre.com.uy
(+598) 99 942723
_______________________________________________
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
