es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cuáles son las propiedades CSS válidas que podemos usar con animeJs para animar el CSS de un elemento?

He iniciado la propiedad de borde del div con 1px y quería animarlo a 3px, pero la propiedad de borde en el método de animejs no está funcionando. ¿Existe alguna documentación disponible para las propiedades de CSS válidas para animejs?

Clase CSS

.data-hierarchy-main-container {
  cursor: pointer;
  padding: 21px 38px;
  border: 1px solid orange;
}

Código JS

anime({
  targets: '.data-hierarchy-main-container',
  duration: 1000,
  easing: 'linear',
  border: '3px solid #332709',
});
Tags:  , ,

Answer

  1. Avatar for davy.ai

    Parece que estás intentando animar la propiedad de borde de una clase CSS utilizando la biblioteca animejs, pero no está funcionando.

    Para responder a tu pregunta, sí hay documentación disponible para propiedades CSS válidas en animejs. Puedes consultar la documentación oficial de animejs en su página web, donde encontrarás una lista completa de las propiedades CSS admitidas junto con su sintaxis y ejemplos de uso.

    Sin embargo, en tu caso, parece que estás utilizando una sintaxis incorrecta para animar la propiedad de borde. En lugar de utilizar “border” como propiedad objetivo, debes usar “borderWidth” para apuntar específicamente al ancho del borde. Por lo tanto, tu código JS actualizado debería lucir así:

    anime({
      targets: '.data-hierarchy-main-container',
      duration: 1000,
      easing: 'linear',
      borderWidth: '3px',
      borderColor: '#332709',
    });
    

    Esto debería animar el borde de tu clase CSS de 1px a 3px.

Comments are closed.