Atención: Este manual puede estar desactualizado, pues usa una librería que hoy ya no se utiliza. Este es un manual interesante desde un punto de vista meramente histórico, porque los ejemplos son precursores de una etapa relevante del mundo del desarrollo web. Nos referimos al mundo del desarrollo frontend antes de jQuery. En este manual explicamos cómo usar una librería llamada X Library que apareció antes de jQuery y otros productos similares. Esta fue la primera librería para desarrollo con Javascript que permitía la creación de código compatible con todos los navegadores. Sin embargo, otras librerías como jQuery desarrollaron la misma idea y, llegando desde atrás consiguieron establecerse de una manera más sólida entre la comunidad de desarrolladores. En resumen: si te interesa aprender a hacer código compatible con todos los navegadores de manera sencilla, hoy es mucho más relevante que aprendas a usar jQuery, al menos como un primer paso, ya que hay otra serie de librerías más avanzadas, orientadas a componentes como React, o el propio estándar de los Web Components.
Este manual explica cómo realizar una buena cantidad de ejemplos DHTML, o HTML Dinámico, creando Javascript que sea compatible con todos los navegadores del mercado.
Para los ejemplos se usa una librería llamada X Library, que permite escribir código llamado "Cross Browser", que es el código que puede funcionar en cualquier plataforma o cliente web.
Artículos del manual
-
1
Cross-Browser. DHTML compatible con todos los navegadores.
Presentamos un sitio web que ofrece interesantes utilidades para el trabajo con HTML Dinámico de una manera sencilla y compatible con los navegadores más habituales.
-
2
X Library Compiler
Una herramienta de Cross-Browser.com que permite crear un juego de funciones o librería personalizada, donde se incluyen todas las funciones que se utilizan en una aplicación.
-
3
Enlaces dinamicos en DHTML
Ejemplo DHTML con una lista de enlaces que muestran una explicación de su contenido al pasar el ratón por encima.
-
4
Menú de navegación desplegable I
Explicamos como realizar un menú de enlaces desplegable para una barra de navegación. Todo ello en DHTML con Javascript compatible con todos los navegadores.
-
5
Menú de navegación desplegable II
Segunda parte del articulo en el cual vemos como crear un menu desplegable con javascript.
-
6
Efecto DHTML cortina, para mostrar una capa poco a poco
Un script compatible con todos los navegadores que realiza una animación DHTML para mostrar una capa, poco a poco, a modo de cortina.
-
7
Pase de diapositivas DHTML
Efecto DHTML de pase de diapositivas en el que se van mostrando una serie de imágenes con un efecto cortina.
-
8
Animación DHTML de texto en una capa
Veremos un ejemplo de DHTML compatible con todos los navegadores para hacer una animación de un texto que se va escribiendo letra a letra.
-
9
Animación DHTML de texto, 2ª Parte
Complicamos un poco la animación de texto con Javascript y capas, jugando con los colores.
-
10
Popup DHTML para mostrar una imagen
Creamos una página con una serie de enlaces que, al pulsarse, muestran unas imágenes asociadas en una capa aparte, de manera similar si se mostrasen en una nueva ventana, pero sin los inconvenientes de los popups.
-
11
Mejorando el popup DHTML para mostrar una imagen
Centramos una capa donde se muestra una imagen, para que quede más o menos en medio del espacio de la ventana del navegador.
-
12
Nueva versión de Popup DHTML
Como sustituir un popup tradicional por una función DHTML que muestra el contenido en una capa. Además, hemos mejorado el popup para que se muestre con un movimiento.
-
13
Un formulario con campos que se esconden con DHTML
Cómo hacer un formulario que tiene algunos campos que se muestran unas veces si y otras no, es decir, algunas opciones se pueden ocultar dependiendo de las acciones del usuario.
-
14
Otro ejemplo de formulario dinámico con campos opcionales
Otra forma de crear un formulario con campos que se muestran y se esconden dependiendo de las acciones del usuario, utilizando DHTML con Javascript cross browser.
-
15
Reloj DHTML, con Javascript y capas
Creamos un reloj dinámico en una página web utilizando DHTML. El reloj se muestra en una capa independiente, que se actualiza a cada segundo con Javascript compatible para todos los navegadores.
-
16
Interfaz de ordenación de elementos DHTML con Javascript
Veamos cómo hacer una interfaz de usuario que permita ordenar elementos de una lista, con botones para subir y bajar el orden de los elementos. Lo hacemos con DHTML compatible con todos los navegadores.
-
17
Rotación de banners DHTML por capas y javascript
Sistema creado con Javascript para rotar todo tipo de banners en un mismo espacio en un intervalo de tiempo.
-
18
Cabecera siempre visible con Javascript DHTML
Script realizado con Javascript y DHTML para que la cabecera siempre esté visible en la parte de arriba de la página, aunque se haga scroll o desplazamiento en la página.