Ver Mensaje Individual
  #1 (permalink)  
Antiguo 01/09/2015, 05:44
matake
 
Fecha de Ingreso: mayo-2013
Mensajes: 191
Antigüedad: 11 años, 6 meses
Puntos: 10
safari interpreta diferente el easing cubic-bezier

Hola,

Estoy intentando hacer unos efectos de transición con funciones cubic-bezier() propios lo que pasa es que en safari ( tengo la version 5.1.7 para windows ) aunque funciona el efecto interpreta de otra manera los valores de cubic-beizer()

Aqui esta el ejemplo:
http://jsfiddle.net/matake/h9pop9w6/

lo curioso es que solo ciertos valores son interpretados diferente. En el ejemplo de arriba he puesto como esasing cubic-bezier(1.000, -0.600, 0.595, 0.090) y no funciona en safari (en otros navegadores si )
pero si pongo esta otra cubic-bezier(0.42, 0, 0.58, 1) funciona correctamente en todos


Mas raro todavia si cambio
Código Javascript:
Ver original
  1. '-webkit-transition': 'all 1s cubic-bezier(1.000, -0.600, 0.595, 0.090)'

por
Código Javascript:
Ver original
  1. '-webkit-transition-timing-function': 'cubic-bezier(1.000, -0.600, 0.595, 0.090)',
  2. '-webkit-transition-duration': '1s'

Entonces el efecto funciona incluso en safari pero es como si tiene otros valores o sea interpreta de otra manera los valores de cubic-beizer

La pregunta es:
¿Alguien que tiene mac ( que no tengo ) o otra version de safari para windows me puede decir si le pasa lo mismo?

(ver primero como funciona en chrome y luego la diferencia con el safari )

Gracias

Última edición por matake; 01/09/2015 a las 06:03