Manual de Mootools

2.- Descarga de Mootools
Podemos descargar Mootools desde la propia página del framework. Debemos elegir los módulos con los que queremos trabajar y la compresión del archivo. Entrar

3.- Primer ejemplo con Mootools
Un primer ejemplo de página web que utiliza Mootools para hacer un efecto sencillo que nos permita conocer el framework sin ningún conocimiento previo del sistema. Entrar

4.- Segundo ejemplo con Mootools
Vamos a otro ejemplo sencillo con Mootools para crear un scroll en una capa de la página. Entrar

5.- Pestañas dinámicas con CSS y Mootools
Sobre cómo crear una interfaz de pestañas dinámicas, maquetadas con CSS y con dinamismo creado con Javascript y Mootools. Entrar

6.- Vídeo del proceso de creación pestañas dinámicas
Veamos un vídeo donde explicamos el uso de Mootools para la creación de una interfaz de pestañas dinámicas e interactivas con Javascript. Entrar

7.- Componentes Mootools
Diversos desarrolladores ofrecen componentes realizados con Mootools para utilizar en páginas web. Entrar

8.- Evento domready de Mootools
El evento domready de Mootools lo podemos asociar al objeto window, para hacer cosas cuando el DOM está listo (Dom Ready). Entrar

9.- Core.js Mootools
Comenzamos la descripción del framework mootools comentando el core, librería de funciones que forman parte del núcleo de mootools. Entrar

10.- Core.js de Mootools (parte II)
Continuan las explicaciones de la librería core de Mootools, que forma el núcleo del framework. Entrar

11.- Clases en Mootools
Descripción y explicaciones sobre las clases en Mootools. Cómo crear clases de programación orientada a objetos con el Framework Mootools. Entrar

12.- Instanciar y trabajar con objetos de clases creadas con Mootools
Ahora veamos la creación de objetos a partir de clases de Mootools y la utilización de esos objetos para acceder a sus propiedades e invocar sus métodos. Entrar

13.- Constructores en Mootools
Qué es un constructor y como se crear constructores a las clases de Mootools. Seguimos explicando acerca del trabajo con clases en Mootools. Entrar

14.- Extends: Extendiendo clases con Mootools
Vamos a ver como realizar herencia de clases (programación orientada a objetos) en Mootools. Cómo extender clases, utilizando Extends. Entrar

15.- Otras formas de extender clases y objetos
Con la función $extend() del core de Mootools, podemos extender unos objetos con las propiedades y métodos de otros objetos. También mostramos cómo crear clases a partir de extender otras clases con objetos. Entrar

16.- Implement: implementando clases en Mootools
Con implement podemos implementar nuevas características y funcionalidades en las clases de Mootools, modificando la propia clase en vez de creando nuevas clases. Entrar

17.- Función $merge() del core Mootools
Veamos la función $merge(), del core de Mootools, que sirve para combinar varios objetos origen en uno solo, destino, sin alterar los objetos origen. Entrar

18.- Element en Mootools. Método $()
El módulo Element de Mootools es uno de los más importantes, que nos permite acceder a cualquier elemento de la página y alterar sus propiedades. Empezamos conociendo el método de Window $(). Entrar

19.- Element en Mootools. Método $$()
Seguimos viendo el módulo Element de Mootools, ahora explicando la función $$(), que sirve para obtener un grupo de elementos de la página. Entrar

20.- Construir elementos en la página con Mootools
Explicaciones sobre la clase Element de Mootools y el constructor de Element, para hacer nuevos elementos en la página. Entrar

21.- Ejemplo de construcción de un elemento e inyección en la página
Cómo construir elementos e inyectarlos en la página con Mootools. Construimos elementos con el constructor de Element y los insertamos en la página con el método inject. Entrar

22.- Seleccionar un elemento con getElement()
Utilizamos la función getElement() de Mootools para seleccionar un elemento de la página web, que luego podremos alterar para cambiar sus propiedades con otros métodos de Element. Entrar

23.- Seleccionar elementos de la página con getElements()
El método getElements() de la clase Element de Mootools permite seleccionar todos los elementos de un tipo o etiqueta. Entrar

24.- Más métodos de la clase Element de Mootools
Para continuar con la clase Element de Mootools, ofrecemos explicaciones y ejemplos sobre los métodos getProperty() y setProperty(), addClass() y removeClass(). Entrar

25.- Más funcionalidades de Element
Continuamos ofreciendo explicaciones sobre métodos de la clase Element de Mootols: empty(), destroy() y clone(). Entrar

26.- Eventos en Mootools: Element Event
Primeras nociones para trabajo con eventos en elementos Mootools, vemos el método addEvent de la clase Element. Entrar

27.- Utilización de bind() en los eventos Mootools
El método bind() de funciones Mootools sirve para cambiar el ámbito de la variable this al invocar una función. Eventos Mootools se utiliza mucho, veremos por qué. Entrar

28.- Más sobre Eventos en Mootools. Método fireEvent
Continuamos viendo la clase Element.Event de Mootools, que contiene un método llamado fireEvent que sirve para lanzar eventos de cualquier elemento de la página. Entrar

29.- Ejemplo práctico de uso de Mootools - Texarea con cuenta de caracteres
Un ejemplo se uso de Mootools para recopilar y afianzar los conocimientos vistos hasta ahora en el manual de Mootools. Vamos a crear un textarea que cuenta los caracteres que se han escrito por el usuario. Entrar

30.- Ejemplo de programación Mootools: Tip simple
Hacemos otro ejemplo sencillo de Mootools, que servirá como práctica: un tip simple en Mootools, que muestra un contenido al situarse sobre un elemento. Entrar

31.- Script sencillo con Mootools: fortaleza de una clave
Un script sencillo con Mootools para mostrar a un usuario la fortaleza de una clave escrita en un campo de formulario. Entrar

32.- Native Array en Mootools
Características extendidas de los Arrays con Mootools, con diversas funciones y métodos para realizar cosas sobre tablas. Entrar

33.- Native Function Mootools
Diversos métodos que se pueden aplicar sobre una función, para extender y mejorar las posibilidades de trabajo con funciones en Mootools. Entrar

34.- Native Number en Mootools
Number es una librería de Mootools para trabajo con números, que aporta pocas pero útiles funcionalidades como redondeos, acotaciones y conversiones de formatos. Entrar

35.- Native String en Mootools
Funcionalidades que añade Mootools a la clase String, nativa de Javascript, para trabajo con cadenas de caracteres. Entrar

36.- Native Hash en Mootools
Hash de Mootools nos ofrece funcionalidades muy útiles para acceso a propiedades y métodos de objetos, para analizar objetos y recorrer todas sus propiedades o iterar con sus elementos. Entrar

37.- Native Event en Mootools
Una clase que nos ayuda a realizar tareas avanzadas con eventos en Mootools. Explicaremos la clase Native Event, cómo utilizarla y cómo parar la ejecución y propagación de eventos. Entrar

38.- Eventos de teclado con Mootools
Veamos cómo definir eventos de teclado, que se desatan cuando el usuario presiona las teclas del teclado, utilizando el framework Javascript Mootols. Entrar

39.- Efectos con Mootools
Comenzamos a estudiar los efectos que se pueden hacer con Mootools con la clase Fx y varias otras que heredan de ella. Entrar

40.- Método fade() para hacer un efecto de fundido
Aprendemos a utilizar el método fade() de la clase Element de Mootools, que sirve para hacer efectos de fundido con transparencia. Entrar

41.- Efecto highlight para destacar un elemento
Un efecto con Mootools para hacer una iluminación o resaltado de un elemento que se quiera destacar con respuesta a las acciones del usuario. Entrar

42.- Método tween de Mootools para efectos sencillos
Explicamos el método tween de Mootools, que sirve para hacer una transición sencilla entre dos valores de un atributo CSS. Entrar

43.- Fx.Tween de Mootools
La clase FX.Tween sirve para hacer efectos totalmente personalizables en Mootools, con una propiedad CSS, desde un valor a otro. Entrar

44.- Eventos de efectos en Mootools
Cómo definir eventos sobre efectos con Mootools y la clase Fx, para realizar cosas cuando se inicie el efecto o se termine. Entrar

45.- Chain de Mootools
Encadenando funciones y efectos Mootools por medio de la clase Chain, para una ejecución secuencial, uno a uno. Entrar

46.- Chain sobre Fx: encadenar efectos Mootools
Ahora veremos cómo encadenar diferentes efectos Mootools con la clase Fx que implementa Chain. Entrar

47.- Class Options de Mootools
La clase Options de Mootools provee de un mecanismo sencillo para que nuestras clases tengan opciones de configuración a los que se puede dar valores por defecto. Entrar

48.- window.getSize en Mootools
El método window.getSize de Mootools, para obtener tamaños de área del navegador y scroll de página. Dependiendo de la declaración Doctype funcionará bien o no en Internet Explorer. Entrar

49.- API Panoramio + ejemplo de JSON con Mootools
Presentamos el API de Panoramio y ofrecemos un ejemplo básico sobre cómo mostrar fotografías en una página web usando JSON y Mootools. Entrar

50.- Ajax con Mootools, ejemplo sencillo
Ejemplo de programación Ajax con Mootools. Mostramos un texto traído con Ajax en una caja de alerta. Entrar

51.- Vídeo: Ajax con Mootools, ejemplos sencillos
Vídeo en el que mostraremos dos ejemplos muy sencillos de Ajax con el framework Javascript Mootools. Entrar

52.- Ejemplo 2 de Ajax utilizando Mootools
Mejoramos el ejemplo anterior de Ajax con Mootools, para que el contenido traído con Ajax se muestre en una capa div. Entrar

53.- Averiguar la posición del ratón al hacer clic
Script en Mootools para saber la posición del puntero del ratón al hacer clic en un elemento de la página. Entrar

54.- Enviar un formulario por Ajax con Mootools
Cómo enviar un formulario con Ajax y mostrar los resultados en la propia página sin recargarla, con Mootools. Entrar