Jonathan Snook sobre la complejidad de animar el <progress> elemento. Si no está familiarizado, ese es el elemento que escupe una imagen similar a un gráfico de barras que indica una posición entre dos valores:
Este ejemplo tiene estilos personalizados, pero entiendes el punto.
La publicación de Jonathan muestra un método para animar un cambio en el valor de progreso usando CSS y un toque de JavaScript mientras se asegura de que se anima correctamente en todos los navegadores modernos. La demostración que hizo se ve bastante ordenada. Estoy seguro de que este va a ser uno de esos puestos a los que vuelvo una y otra vez.
Recientemente compartimos una publicación de Dave Rupert que adopta un enfoque SVG. Jeremias Menichelli también tiene un enfoque alternativo, creando una forma de anillo y convirtiéndola en un componente React.
Enlace directo →