Tengo una página con algunas animaciones CSS. Esta página también tiene un mapa generado a través de la API de Google Maps.

Puede ver una demostración simplificada aquí:

http://dev.timmurtaugh.com/demo/projects-map-debug.html

Si hace clic en el enlace de tamaño "Alternar tamaño" antes de pasar el cursor sobre el "Elemento de navegación principal", verá que el tamaño del elemento alterno cambia como se esperaba.

Sin embargo, una vez que pasa el cursor sobre el elemento de navegación, que debería activar un menú desplegable a través de CSS, no solo no aparece el menú desplegable, sino que el enlace "Cambiar tamaño" deja de funcionar.

Como si esto no fuera lo suficientemente extraño, el inspector web piensa que todo está funcionando normalmente - informa que el tamaño de la caja está cambiando, cuando visualmente no es así.

Intenté aislar el mapa en un iframe y obtuve los mismos resultados.

Esto parece suceder solo en Safari (5.1.5) / Mac, no en ningún otro navegador que haya verificado (último Chrome / Firefox / Internet Explorer 9).

He probado las sugerencias de esta pregunta: jQuery jScrollPane problema / conflicto con mapas de Google en Safari

... y en este: Mac Safari 5.0.4 error al usar la API de Google Maps

¿Hay algo que pueda hacer?

3
Tim 12 may. 2012 a las 21:37
Hay muchas cosas que suceden allí. Después de jugar en el inspector, si cambia "-webkit-transition" de TODO a solo Opacidad (y elimina la visibilidad: oculta;), parece funcionar en Safari para mí. ?
 – 
folktrash
14 may. 2012 a las 21:47
¿Podrías dejar esto en un violín con enlaces absolutos? Sería muy fácil pinchar :)
 – 
folktrash
14 may. 2012 a las 22:08
La plantilla completa tiene incluso más instancias de animaciones que se estaban rompiendo, y parece que la eliminación del factor de visibilidad les ha devuelto la salud a todas.
 – 
Tim
15 may. 2012 a las 01:42

1 respuesta

La mejor respuesta

Con las anulaciones mencionadas anteriormente (visibilidad: visible; & -webkit-tranistion: opacidad ...;) esto parece funcionar para mí.

http://jsfiddle.net/vxfhT/1/

2
folktrash 14 may. 2012 a las 23:45
W00! mi primera respuesta SO rubor
 – 
folktrash
15 may. 2012 a las 01:54