Ejemplo de animación dentro de scriptcase

Á

Álvaro Moura

Última actualización el Jul 6, 2026

Esto es un ejemplo de como colocar animación a la hoja del formulario,

1 - Nos dirigimos ala pagina de https://github.com/animate-css/animate.css para descargar el .zip de las animaciones.

2 - Descargado el .zip procedemos a cargar el archivo descargado como librería externadel scriptcase.

      - Puede seguir este manual: https://www.scriptcase.net/docs/es_es/v9/manual/07-tools/04-external-libraries/

3- Una vez realizado la carga de la librería externa, nos dirigimos al evento OnApplicationInit de nuestro formulario.

      - Aquí procedemos al llamado de nuestra librería externa.

      - Para aplicar nuestra animación a nuestro formulario, necesitamos del ID del formulario, procedemos a ejecutar el formulario y luego hacemos clic en inspeccionar elemento, donde debemos buscar la clase delformulario, en este caso se llama scFormPage

4 - Tomamos dicho nombre de la clase scFormPage y agregamos a nuestro código delibrerias externas.

      Un ejemplo seria el siguiente código en el evento OnApplicationInit:

?>

bounceIn.css');?>">

// Donde se realiza la llamada a la librería.scFormPage { //aqui se utiliza el nombre del formulario obtenido anteriormente  animation-name:bounceIn;  //Se coloca el nombre de la animación animation-duration:4s;}@keyframesbounceIn {  from,20%, 40%, 60%, 80%,  to{   animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);  }  0%{    opacity:0;    transform:scale3d(0.3, 0.3, 0.3);  }  20%{    transform:scale3d(1.1, 1.1, 1.1);  }  40%{    transform:scale3d(0.9, 0.9, 0.9);  }  60% {    opacity:1;    transform:scale3d(1.03, 1.03, 1.03);  }  80%{    transform:scale3d(0.97, 0.97, 0.97);  }  to{    opacity:1;    transform:scale3d(1, 1, 1);  }}.bounceIn{ animation-duration:0.75s;  animation-name:bounceIn;}

PHP</span

5 - Procedemos a ejecutar el formulario, donde visualizaremos la animación.