Jeje no soy dedos rápidos es solo que como estoy de "vacaciones"(no hay
proyectos ke hacer T_T) tengo abierto el thunderbird y pues ando viendo
en que puedo ayudar o que sale en las listas para entretenerme jeje^^ y
pues perdon el malentendido como ke los símbolos de exclamación !! se me
figuran gritos jeje y pues para que esto no sea offtopic... pues a mi
modo de ver las cosas tienes razon porque emular algo que existe por
naturaleza propia ... lo mismo le pregunto a mocosoft con IE6... pero
bueno... ya habrá alguna solución de mientras le pregunto a google haber
ke me dice jeje ke ya me dejaste la duda xD
LISTAS escribió:
> No hombre, tu ayuda es bienvenida, ¡¡¡siempre!!! Para mí y para cualquiera.
> Permítete las observaciones de toda calaña y crecerás como un roble. Yo sólo
> respondí a tu pregunta, con humor pero sin ánimo de ofensa (a mi edad
> considero que el humor es lo único que puede rescatarnos, inclusive, de las
> ofensas). Eso sí: casi-casi me contestaste antes de enviarte mi correo.
>
> ¿Eres "dedos-rápidos" en el teclado, ¡eh...!?
>
> Por otro lado, no me molestaste con tu "inútil" código. No hay "códigos
> inútiles". Hay "inútiles" y "códigos". Y "códigos entre inútiles" e
> "inútiles que hablan en código", ja. Pero ningún código es inútil porque un
> código de programación es algo que "SIEMPRE" dependerá de otros, es algo que
> se construye de modo "COLECTIVO". Internet es un fenómeno colectivo, ¡vaya!
> ¿O acaso todos nacimos sabiendo y vamos por la vida de uno en uno? Sin ti yo
> no sería nada y sin mi, tú tampoco, creo. Por eso estamos en esta lista
> compartiendo ignorancia y conocimiento y creciendo juntos. Y no estamos
> solos, ni ahí...
>
> Yo hice esas 2 tontas líneas de código "copiando" partes de un "código
> inútil" que sólo funcionaba en Explorer. Pero ese código me inspiró para
> hacerlo crossbrowser, de modo que "no fue tan inútil" como parecía a simple
> vista. Bueno, basta de jaleo que ya me estoy poniendo cursi... Bay, bay y
> gracias por colaborar.
>
> A.V.W.
>
> ----- Original Message -----
> From: "final20" <[EMAIL PROTECTED]>
> To: "Ovillo, la lista de CSS en castellano" <ovillo@lists.ovillo.org>
> Sent: Thursday, August 16, 2007 7:32 PM
> Subject: Re: [Ovillo] comportamiento hover
>
>
> Bueno... yo solo quería ayudar disculpa si te moleste con mi "inutil"
> javascript ...
>
> LISTAS escribió:
>
>> ¡Oh, sí, claro! Me refiero a lo siguiente: ¿para qué emular algo que ya
>> existe por naturaleza propia? Es como inventar la pera virtual pudiendo
>> comerme la verdadera.
>>
>> Si lo hago por truco (javascript) lo hago más limpio entonces: le digo que
>> al hacer mouseover reemplace el backgroundImage y lo vuelva a reemplazar
>> con
>> el mouseuot... ;-)
>>
>> ¡¡¡Pero yo no quiero hacerlo con Javacript!!! Porque eso sería para mí lo
>> más fácil y quiero resolverlo todo con CSS. Bueno, al menos, ese es el
>> espíritu de esta lista, ¿no?
>>
>> Con Javascript puedo hacerlo inclusive con CLASS e ID indistintamente con
>> unos bobos códigos de 1 sola línea inventados por mi y compatibles con
>> Firefox, Opera, Explorer 6, 7... Pero repito: creía que se podía hacerse
>> con
>> "CLASS" tanto como con "ID" pero parece que ese día los cráneos del W3C
>> estaban mirando una mariposilla... ¡snif!
>>
>> De todos modos gracias por el código, los consejos y las recomendaciones.
>> Y
>> como gentileza, va mi engendro para quien lo desee aprovechar:
>>
>> <html>
>> <head>
>> <title>Cambios de fondo (hasta suena revolucionario)</title>
>> <style type="text/css">
>> <!--
>> #etiqueta, .etiqueta1 {background-image:
>> url(imagenes/fondo-lenguetas-1.gif); width: 70px; height: 25px}
>> .etiqueta2 {background-image: url(imagenes/fondo-lenguetas-2.gif); width:
>> 70px; height: 25px}
>> -->
>> </style>
>> <script type="text/javascript">
>> function cambioFondo(nombre,ruta){
>> document.getElementById(nombre).style.backgroundImage="url("+ruta+")"
>> }
>> function cambioClase(nombre,clase){
>> document.getElementById(nombre).className=clase
>> }
>> </script>
>> </head>
>> <body>
>> <div
>> id="etiqueta"onmouseover="cambioFondo('etiqueta','imagenes/fondo-lenguetas-2.gif')";
>> onmouseout="cambioFondo('etiqueta','imagenes/fondo-lenguetas-1.gif')">CON
>> ID</div>
>> <div id="esta" class="etiqueta1"
>> onmouseover="cambioClase('esta','etiqueta2')";
>> onmouseout="cambioClase('esta','etiqueta1')">CON CLASS</div>
>> </body>
>> </html>
>>
>> A.V.W.
>>
>> ----- Original Message -----
>> From: "final20" <[EMAIL PROTECTED]>
>> To: "Ovillo, la lista de CSS en castellano" <ovillo@lists.ovillo.org>
>> Sent: Thursday, August 16, 2007 5:25 PM
>> Subject: Re: [Ovillo] comportamiento hover
>>
>>
>> No entiendo exactamente a que te refieres el script lo único que hace es
>> emular el comportamiento hover en IE6, en IE7 va bien sin el script
>> pero en IE6 no se acepta este comportamiento cualquier otro elemento que
>> no sea un "<a>" esa es la función del script emular este comportamiento
>> en IE6 si me pudieras explicar un poco mejor lo del id ^^ tal ves
>> podríamos adaptarlo para que se ajuste mas a tus necesidades ^^
>>
>> LISTAS escribió:
>>
>>
>>> Gracias. Pero hete aquí un detalle: si va a funcionar por medio de ID, no
>>> hace falta un javascript ya que el ID es común a todos los navegadores,
>>> ergo: mayor accesibilidad y menores recursos. El truco estaría bueno si
>>> lo
>>> hiciese con CLASS, y no lo hace... :(
>>>
>>> A.V.W.
>>>
>>> ----- Original Message -----
>>> From: "final20" <[EMAIL PROTECTED]>
>>> To: "Ovillo, la lista de CSS en castellano" <ovillo@lists.ovillo.org>
>>> Sent: Thursday, August 16, 2007 3:48 PM
>>> Subject: Re: [Ovillo] comportamiento hover
>>>
>>>
>>> Pues yo lo que te recomiendo es que lo hagas usando javascript para que
>>> funcione en IE6 ya que para IE la pseudo clase hover solo existe en los
>>> vínculos "<a>" quedaría de esta manera:
>>>
>>> EL CSS:
>>>
>>> <style type="text/css">
>>> #IMGHover { /*Identificador de la capa que hace el hover */
>>> width: 200px;/*Especifico el tamaño del div para que no se pase de
>>> las dimenciones visibles de la imagen en este caso 200x200px*/
>>> height: 200px;
>>> background-image: url(bg.jpg);/*Ponemos la imagen que se puede ver
>>> abajo */
>>> background-position: top;/* especificamos la posicion de la imagen
>>> del fondo */
>>> background-repeat:no-repeat;/* por si las dudas le decimos ke no
>>> repita el fondo */
>>> }
>>> #IMGHover:hover, #IMGHover.over {/* aqui esta la magia ponemos la pseudo
>>> clase :hover para mozilla IE7 y le ponemos la clase over para IE esta
>>> sera reemplazada por DOM con javascript */
>>> background-position: bottom; /* esto es lo que hace que la imagen
>>> cambie en este caso solo cambiamos la posicion de la imagen para que se
>>> vea la parte de abajo*/
>>> }
>>> </style>
>>>
>>> EL JavaScript:
>>>
>>> // JavaScript Document
>>>
>>> startList = function() {// modifique el script de suckerfish para que
>>> funcione con esta div ^^
>>> if(document.all&&document.getElementById){// checamos que se trate de
>>> IE
>>> overDiv = document.getElementById("IMGHover"); //Obtenemos la
>>> div ^^
>>> overDiv.onmouseover = function() {//cuando pasen el mouse sobre
>>> la div...
>>> this.className +=" over";//le agregamos una clase en este
>>> caso over que es la que especificamos en css
>>> }
>>> overDiv.onmouseout = function() {//cuando el mouse salga de la
>>> div...
>>> this.className = this.className.replace(" over","");//le
>>> quitamos la clase ^^
>>> }
>>> }
>>> }
>>> window.onload=startList;//cuando la cargue la pagina ^^ ejecutar la
>>> funcion xD
>>>
>>> El HTML:
>>>
>>> <div id="IMGHover"></div>
>>>
>>> y pues bueno para que veas como funciona lo colgué en geocities Jeje
>>> allí puedes ver el código fuente para entender mejor su funcionamiento
>>> ya lo probe en IE6 y pues no deveria dar problemas aunque pues no
>>> aseguro nada ya ke mi IE6 es emulado ^^
>>>
>>> http://mx.geocities.com/nma2040/divOver/div.html
>>>
>>> Espero te sea de utilidad ^^ Saludos!!!
>>> LISTAS escribió:
>>>
>>>
>>>
>>>> Funciona en Explorer, pero no en Firefox... y necesito que lo haga en
>>>> por
>>>> lo
>>>> menos estos 2... :(
>>>> ¿A ti te funciona en ambos?
>>>>
>>>> Si es así, pásame el enlace a tu calendario y lo miro. Gracias.
>>>>
>>>> A.V.W.
>>>>
>>>> ----- Original Message -----
>>>> From: "Jazmin Azucena Nieto Garduño" <[EMAIL PROTECTED]>
>>>> To: "Ovillo, la lista de CSS en castellano" <ovillo@lists.ovillo.org>
>>>> Sent: Wednesday, August 15, 2007 3:26 PM
>>>> Subject: Re: [Ovillo] comportamiento hover
>>>>
>>>> Hola buenas tardes :)
>>>>
>>>> yo tengo una que estoy usando en un calendario, te envio mi codigo,
>>>> espero
>>>> que te sirva
>>>>
>>>> y es class
>>>>
>>>> ( today, es como doy de alta en mi tabla la imagen (cuando cargas la
>>>> pagina))
>>>>
>>>> .today {
>>>> FONT-WEIGHT: bold;
>>>> TEXT-ALIGN:center;
>>>> BACKGROUND-IMAGE: url(cuadc.gif);
>>>> COLOR: #000000;
>>>> border-bottom: 0px;
>>>> height:20px;
>>>> }
>>>>
>>>> TD.today A {
>>>> FONT-WEIGHT: bold;
>>>> TEXT-ALIGN:center;
>>>> COLOR: 666666;
>>>> height:20px;
>>>>
>>>> }
>>>>
>>>> (esta es la imagen que se ve cuando pones el link, en mi caso yo tengo
>>>> la
>>>> misma que en un principio)
>>>>
>>>> TD.today A:link {
>>>> FONT-WEIGHT: bold;
>>>> TEXT-ALIGN:center;
>>>> BACKGROUND-IMAGE: url(cuadc.gif);
>>>> COLOR: #666666;
>>>> height:20px;
>>>> }
>>>>
>>>> (Aqui esta el meollo del asunto)(pones la misma imagen que en un
>>>> principio
>>>> porque quiero que aunque ya hayan entrado en el link se siga viendo
>>>> igual)
>>>>
>>>> TD.today A:visited {
>>>> FONT-WEIGHT: bold;
>>>> TEXT-ALIGN:center;
>>>> BACKGROUND-IMAGE: url(cuadc.gif);
>>>> COLOR: #660033;
>>>> height:20px;
>>>> }
>>>>
>>>> (esta imagen se ve cuando pones el puntero sobre el link)en esta caso
>>>> tengo
>>>> otra)
>>>>
>>>> TD.today A:hover {
>>>> FONT-WEIGHT: bold;
>>>> TEXT-ALIGN:center;
>>>> BACKGROUND-IMAGE: url(cuadclnk.gif);
>>>> COLOR: #FFFFFF;
>>>> height:20px;
>>>> }
>>>>
>>>> bueno :), espero que te sirva. (es parte del codigo de un calendario que
>>>> tengo)
>>>> bye me dices si te sirvio)
>>>>
>>>>
>>>>
>>>>
>>>>
>>>>> ----- Original Message -----
>>>>> From: LISTAS <[EMAIL PROTECTED]>
>>>>> To: "Ovillo, la lista de CSS en castellano" <ovillo@lists.ovillo.org>
>>>>> Subject: Re: [Ovillo] comportamiento hover
>>>>> Date: Tue, 14 Aug 2007 18:32:47 -0300
>>>>>
>>>>>
>>>>> OK, funciona con ID, pero no entiendo porqué con CLASS no funciona. Yo
>>>>> había
>>>>> hecho todo "tal cual el ejemplo" sugerido pero con CLASS.
>>>>>
>>>>> ¿Alguien sabe por qué con uno sí y con el otro no?
>>>>>
>>>>> Con Explorer lo resolví anidando un Anchor entre dos DIV... pero me
>>>>> desapareció la manito del enlace, aunque enlaza perfectamente... (!!)
>>>>> De
>>>>> modo que hice una truca exclusiva para el cursor con Explorer y todo
>>>>> quedó
>>>>> a
>>>>> pedir de boca.
>>>>>
>>>>> De todos modos, es un bodrio que no se resuelva con una simple clase ya
>>>>> que
>>>>> hay que encadenar tantos estilos como recursos haya (#enlace1,
>>>>> #enlace2,
>>>>> #enlace3, etc. + (#enlace1:hover, #enlace2:hover, #enlace3:hover,
>>>>> etc. ).
>>>>>
>>>>> En fin, gracias por todo.
>>>>>
>>>>> A.V.W.
>>>>>
>>>>> ----- Original Message -----
>>>>> From: "Almorca" <[EMAIL PROTECTED]>
>>>>> To: "Ovillo, la lista de CSS en castellano" <ovillo@lists.ovillo.org>
>>>>> Sent: Tuesday, August 14, 2007 9:17 AM
>>>>> Subject: Re: [Ovillo] comportamiento hover
>>>>>
>>>>>
>>>>> Pues con hover como muy bien has puesto en el título.
>>>>>
>>>>> Prueba con
>>>>>
>>>>> #id {
>>>>> background: transparent url(imagen1.png) no-repeat;
>>>>> }
>>>>> #id:hover {
>>>>> background: transparent url(imagen2.png) no-repeat;
>>>>> }
>>>>>
>>>>> El problema es que IE sólo te deja usar hover con enlaces por lo que
>>>>> tendrás
>>>>> que usar algún hack para IE. Prueba con la librería
>>>>> IE7.<http://dean.edwards.name/IE7/>
>>>>>
>>>>> El día 14/08/07, LISTAS <[EMAIL PROTECTED]> escribió:
>>>>>
>>>>>
>>>>>
>>>>>
>>>>>> Un problema: tengo un div que como fondo tiene una imagen y quiero que
>>>>>> al
>>>>>> poner el cursor sobre el mismo me cambie la imagen y al salir me
>>>>>> devuelva
>>>>>> la
>>>>>> original. ¿Cómo se hace eso con CSS?
>>>>>>
>>>>>>
>> _______________________________________________
>> 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
>>
>>
>>
>
> _______________________________________________
> 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
>
> _______________________________________________
> 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
>
>
_______________________________________________
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
