¿Qué es script.aculo.us?
script.aculo.us es un conjunto de bibliotecas JavaScript de código abierto diseñadas para mejorar la interfaz de usuario de los sitios web. Proporciona un motor de efectos visuales, una biblioteca de arrastrar y soltar, controles (controles deslizantes, edición en el lugar, finalización automática basada en Ajax) y más a través del Modelo de objetos de documento (DOM). Fue lanzado al público por primera vez en junio de 2005 por Thomas Fuchs.
¿Por qué script.aculo.us?
- Se pueden agregar o crear efectos visuales.
- Controls ofrece múltiples elementos de interfaz de usuario.
- Builder permite crear elementos DOM con facilidad.
Características de script.aculo.us
1. Efectos visuales: Viene con veinticinco efectos visuales y siete modos de transición de los cuales cinco efectos básicos que ofrece script.aculo.us son Opacidad, Escala, MoveBy, Resaltado y Paralelo. Además, los programadores pueden ampliar los efectos existentes y crear nuevos.
2. Controles:
- Facilita la creación del módulo de arrastrar y soltar.
- Proporciona campos de entrada de autocompletado.
- También permite la edición en el lugar y mucho más.
3. Sonido: te permite reproducir sonidos, usar múltiples pistas, ponerlas en cola y aún tener más para ofrecer.
4. Portabilidad: Todos los códigos del marco script.aculo.us están escritos en JavaScript, que se ejecuta en la mayoría de las plataformas disponibles en la actualidad.
5. Popularidad de script.aculo.us: script.aculo.us es utilizado por muchas organizaciones populares como NASA, Apple, IKEA, Gucci, Shopify, Ruby on Rails, etc. Por lo tanto, se considera confiable y eficiente.
Instalación de script.aculo.us: La instalación de script.aculo.us se puede hacer fácilmente. Además, es lo mismo para la mayoría de las plataformas disponibles, por lo que no debe preocuparse por la plataforma del sistema operativo en la que se encuentra. Sólo tienes que seguir los pasos que se indican a continuación:
- Descargue el archivo zip script.aculo.us desde la página de descarga .
- Extraiga el paquete descargado. Después de la extracción, encontrará estos archivos y carpetas que se muestran a continuación.
Archivos y carpetas extraídos
- Ahora copie todos los archivos en la carpeta src en su carpeta de proyecto (sound.js y unittest.js son opcionales). Tendrá estos archivos; builder.js, controls.js, dragdrop.js, effects.js, scriptaculous.js, sound.js, unittest.js y slider.js.
- Copie también el prototipo.js de la carpeta lib a la carpeta de su proyecto.
Archivos requeridos en la carpeta del proyecto
Uso: Ya está todo listo para usar la biblioteca script.aculo.us en su proyecto. Veamos cómo usarlo ahora:
- Cargue el prototipo.js y scriptaculous.js en su proyecto como se muestra a continuación.
html
<!DOCTYPE html> <html> <head> <title>script.aculo.us usage</title> <!-- Load the javascript files that we copied earlier during installation --> <script type="text/javascript" src="./prototype.js"> </script> <script type="text/javascript" src="./scriptaculous.js"> </script> </head> <body> <!-- YOUR CODE --> </body> </html>
- Ahora puede usar todas las funciones que están disponibles como el efecto de resaltado. Se puede encontrar más en el sitio de documentación oficial .
<a href=”#” onclick=”new Effect.Highlight(this.parentNode, { startcolor: ‘#ffff99’,
endcolor: ‘#ffffff’ }); devuelve false;”>
¡Resáltame!
</a>
Nota: También puede modificar la etiqueta del script en el código dado para cargar solo las funciones requeridas. Veamos un ejemplo:
html
<!DOCTYPE html> <html> <head> <title>script.aculo.us usage</title> <!-- Here we're loading visual effects and dragdrop features only --> <script type="text/javascript" src="./prototype.js"> </script> <!-- The scripts that can be specified are: builder, effects, dragdrop, controls, and slider --> <script type="text/javascript" src="./scriptaculous.js?load = effects, dragdrop"> </script> </head> <body> <!-- YOUR CODE --> </body> </html>
Beneficios de la biblioteca script.aculo.us:
- Hace que el desarrollo sea más rápido.
- Ligero y fácil de usar.