Este ejemplo proporciona 29 plantillas de curvas de Bézier en CSS3, ?todo el código proviene de Internet! Puedes utilizar estas plantillas comunes de curvas de Bézier cúbicas por tu cuenta, o ajustar tus propios efectos de animación cúbica de Bézier a través de una herramienta de curvas de Bézier. Una curva de Bézier está compuesta por 4 puntos, la función de curva de Bézier en CSS3, el punto de inicio predeterminado tiene coordenadas (0,0) y el punto final tiene coordenadas (1,1), por lo que solo necesitas controlar los otros 2 puntos de dirección para obtener una curva de Bézier completa. ?Solo los navegadores que soporten efectos de Css3 pueden ver el efecto!
-webkit-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
?? -moz-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
???? -o-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
??????? transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);-webkit-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
?? -moz-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
???? -o-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
??????? transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
Recientemente has utilizado: