Aplicación de comportamientos JavaScript incorporados

Los comportamientos incluidos con Dreamweaver se han escrito para que funcionen en los navegadores modernos. Los comportamientos no producen resultados en los navegadores antiguos.

Aunque las acciones de Dreamweaver se han escrito para maximizar la compatibilidad con los distintos navegadores, algunos navegadores no son compatibles con JavaScript y, además, muchos usuarios navegan por la web con JavaScript desactivado en sus navegadores. Para obtener la mejor compatibilidad en distintas plataformas, incorpore interfaces alternativas incluidas en etiquetas <noscript> para que las personas sin JavaScript puedan usar el sitio.

Aplicación del comportamiento Llamar JavaScript

El comportamiento Llamar JavaScript ejecuta una función personalizada o línea de código JavaScript cuando se produce un evento. (Puede escribir el script usted mismo o usar el código que tiene a su disposición en diversas bibliotecas JavaScript de acceso gratuito en la Web.)

Aplicación del comportamiento Cambiar propiedad

Utilice el comportamiento Cambiar propiedad para cambiar el valor de una de las propiedades de un objeto (por ejemplo, el color de fondo de una div o la acción de un formulario).

Aplicación del comportamiento Comprobar complemento

Use el comportamiento Comprobar complemento para remitir a los visitantes a distintas páginas dependiendo de si tienen instalado el complemento en cuestión. Por ejemplo, puede resultar conveniente que los visitantes vayan a una página si tienen Shockwave y a otra distinta si no lo tienen.

Aplicación del comportamiento Arrastrar elemento PA

El comportamiento Arrastrar elemento PA permite al visitante arrastrar un elemento con posición absoluta (PA). Use este comportamiento para crear puzzles, controles deslizantes y otros elementos móviles de interfaz.

Se puede especificar la dirección en la que el visitante puede arrastrar el elemento PA (en horizontal, vertical o en cualquier dirección), un destino hasta el que el visitante debe arrastrar el elemento PA, si el elemento PA debe ajustarse al destino cuando el elemento PA se encuentra a un cierto número de píxeles del destino y qué sucederá cuando el elemento PA llegue al destino, entre otras opciones.

Dado que la llamada al comportamiento Arrastrar elemento PA debe producirse antes de que el visitante pueda arrastrar el elemento PA, debe asociar Arrastrar elemento PA al objeto body (con el elemento onLoad).

Recopilación de información sobre el elemento AP desplazable

Cuando se adjunta a un objeto el comportamiento Arrastrar elemento AP, Dreamweaver inserta la función MM_dragLayer() en la sección head del documento. (La función conserva la antigua denominación en inglés de los elementos PA [es decir “Layer”, capa] para que sea posible continuar editando las capas creadas en versiones anteriores de Dreamweaver). Además de registrar el elemento PA como desplazable, esta función define tres propiedades para cada elemento PA desplazable (MM_LEFTRIGHT, MM_UPDOWN y MM_SNAPPED) que usted puede usar en sus propias funciones JavaScript para determinar la posición horizontal relativa del elemento PA, la posición vertical relativa del elemento PA y si el elemento PA ha alcanzado el destino en el que debe soltarse.

Por ejemplo, la siguiente función muestra el valor de la propiedad MM_UPDOWN (la posición vertical actual del elemento PA) en un campo de formulario llamado curPosField. (Los campos de formulario son útiles para mostrar información que se actualiza continuamente, ya que son dinámicos; es decir, se puede cambiar el contenido de los mismos una vez que la página ha terminado de cargarse).

En lugar de mostrar el valor de MM_UPDOWN o MM_LEFTRIGHT en un campo de formulario, puede utilizar dichos valores de muchas otras maneras. Por ejemplo, puede crear una función que presente un mensaje en el campo de formulario dependiendo de lo próximo que esté el valor de la zona donde debe soltarse la capa, o bien puede llamar otra función para que muestre u oculte un elemento PA dependiendo del valor.

Resulta especialmente útil leer la propiedad MM_SNAPPED cuando se tienen varios elementos PA en la página y todos ellos deben alcanzar sus objetivos antes de que el visitante pueda pasar a la siguiente página o tarea. Por ejemplo, puede crear una función para determinar cuántos elementos PA tienen un valor MM_SNAPPED igual a true (verdadero) y llamarla cada vez que se suelte un elemento PA. Cuando el recuento de capas ajustadas alcanza el número deseado, puede enviar al visitante a la página siguiente o presentarle un mensaje emergente de felicitación.

Aplicación del comportamiento Ir a URL

El comportamiento Ir a URL abre una nueva página en la ventana actual o en el marco especificado. Este comportamiento resulta útil para cambiar el contenido de dos o más marcos con un solo clic.

Aplicación del comportamiento Menú de salto

Al crear un menú de salto mediante Insertar > Formulario > Menú de salto, Dreamweaver crea un objeto de menú y le adjunta el comportamiento del Menú de salto (o Menú de salto Ir). Normalmente no es preciso adjuntar manualmente el comportamiento Menú de salto a un objeto.

Un menú de salto existente se puede editar de dos formas:

• Se pueden editar y reorganizar los elementos del menú, cambiar los archivos a los que se salta y cambiar la ventana en la que esos archivos se abren haciendo doble clic en un comportamiento de Menú de salto existente en el panel Comportamientos.

• Los elementos de este menú se editan igual que los de cualquier menú, es decir, seleccionando el menú y usando el botón Valores de lista del inspector de propiedades.

Aplicación del comportamiento Menú de salto Ir

El comportamiento Menú de salto Ir está estrechamente relacionado con el comportamiento Menú de salto. Menú de salto Ir le permite asociar un botón Ir con un menú de salto. (Para utilizar este comportamiento debe existir ya un menú de salto en el documento). Al hacer clic en el botón Ir, se abre el vínculo seleccionado en el menú de salto. Los menús de salto generalmente no necesitan un botón Ir; al seleccionar un elemento de un menú de salto, normalmente se carga un URL sin necesidad de que el visitante lleve a cabo ninguna otra acción. No obstante, si el visitante selecciona el mismo elemento que se encuentra ya seleccionado en el menú de salto, el salto no se producirá. En general, eso no importa, pero si aparece el menú de salto en un marco y los elementos del menú de salto contienen vínculos con páginas de otros marcos, suele ser útil disponer de un botón Ir para permitir a los visitantes volver a elegir un elemento que ya esté seleccionado en el menú de salto.

Aplicación del comportamiento Abrir ventana del navegador

Use el comportamiento Abrir ventana del navegador para abrir una página en una nueva ventana. Se pueden especificar las propiedades de la nueva ventana, incluidos su tamaño, sus atributos (si se puede cambiar su tamaño, si tiene barra de menús, etc.) y su nombre. Por ejemplo, este comportamiento se puede usar para abrir una imagen más grande en otra ventana distinta cuando el visitante hace clic en una imagen en miniatura. Con este comportamiento, puede hacer que la nueva ventana tenga el mismo tamaño que la imagen.

Si no se especifican los atributos de la ventana, se abrirá con el mismo tamaño y los mismos atributos de la ventana desde la que se abrió. Al especificar algún atributo de la ventana, se desactivan automáticamente todos los demás atributos que no se activen explícitamente. Por ejemplo, si no se establecen los atributos de la ventana, puede abrirse con un tamaño de 1024 x 768 píxeles y tener barra de navegación (con los botones Atrás, Adelante, Inicio y Actualizar), barra de herramientas de ubicación (en la que se muestra el URL), barra de estado (en la que se muestran mensajes de estado, en la parte inferior) y barra de menús (en la que se muestran Archivo, Edición, Ver y otros menús). Si se establece explícitamente la anchura en 640 píxeles y la altura en 480 píxeles y no se establece ningún otro atributo, la ventana se abrirá con un tamaño de 640 x 480 píxeles y carecerá de barras de herramientas.

Aplicación del comportamiento Mensaje emergente

El comportamiento Mensaje emergente muestra una alerta de JavaScript con el mensaje que usted especifique. Dado que las alertas de JavaScript solo tienen un botón (Aceptar), utilice este comportamiento para proporcionar información al usuario y no para proponer una elección.

Puede incrustar en el texto cualquier llamada, propiedad, variable global u otra expresión de función JavaScript válida. Para incrustar una expresión JavaScript, enciérrela entre llaves ({}). Para que aparezca una llave, antepóngale una barra invertida (\{).

Ejemplo:

Aplicación del comportamiento Carga previa de imágenes

El comportamiento Carga previa de imágenes reduce el tiempo de visualización mediante la creación de un caché para las imágenes que no se muestran cuando aparece la página inicialmente (por ejemplo, las imágenes que se intercambiarán por comportamientos o scripts).

Aplicación del comportamiento Definir texto de marco

El comportamiento Definir texto de marco permite definir de forma dinámica el texto de un marco mediante la sustitución del contenido y el formato de un marco con el contenido que usted especifique. Dicho contenido puede incluir cualquier código HTML válido. Utilice este comportamiento para mostrar información de forma dinámica.

Aunque el comportamiento Definir texto de marco sustituye el formato de un marco, puede seleccionar Conservar color de fondo para conservar los atributos de color de fondo y de texto de la página.

Puede incrustar en el texto cualquier llamada, propiedad, variable global u otra expresión de función JavaScript válida. Para incrustar una expresión JavaScript, enciérrela entre llaves ({}). Para que aparezca una llave, antepóngale una barra invertida (\{).

Ejemplo:

Aplicación del comportamiento Definir texto de contenedor

El comportamiento Definir texto de contenedor reemplaza el contenido y el formato de un contenedor existente (es decir, cualquier elemento que pueda contener texto u otros elementos) en una página con el contenido que usted especifique. Dicho contenido puede incluir cualquier código HTML válido.

Puede incrustar en el texto cualquier llamada, propiedad, variable global u otra expresión de función JavaScript válida. Para incrustar una expresión JavaScript, enciérrela entre llaves ({}). Para que aparezca una llave, antepóngale una barra invertida (\{).

Ejemplo:

Aplicación del comportamiento Establecer texto de la barra de estado

El comportamiento Establecer texto de la barra de estado muestra un mensaje en la barra de estado, situada en la esquina inferior izquierda de la ventana del navegador. Por ejemplo, puede usar este comportamiento para describir el destino de un vínculo en la barra de estado en lugar de mostrar el URL al que está asociado. A menudo los visitantes omiten o no advierten los mensajes de la barra de estado (además, no todos los navegadores proporcionan soporte completo para introducir texto en la barra de estado). Si el mensaje es importante, puede mostrarlo en forma de mensaje emergente o como texto de un elemento PA.

Puede incrustar en el texto cualquier llamada, propiedad, variable global u otra expresión de función JavaScript válida. Para incrustar una expresión JavaScript, enciérrela entre llaves ({}). Para que aparezca una llave, antepóngale una barra invertida (\{).

Ejemplo:

Aplicación del comportamiento Definir texto de campo de texto

El comportamiento Definir texto de campo de texto sustituye el contenido del campo de texto de un formulario por el contenido que usted especifique.

Puede incrustar en el texto cualquier llamada, propiedad, variable global u otra expresión de función JavaScript válida. Para incrustar una expresión JavaScript, enciérrela entre llaves ({}). Para que aparezca una llave, antepóngale una barra invertida (\{).

Ejemplo:

Creación de un campo de texto con nombre

Aplicación de Definir texto de campo de texto

Aplicación del comportamiento Mostrar-Ocultar elementos

El comportamiento Mostrar-Ocultar elementos muestra, oculta o restaura la visibilidad predeterminada de uno o varios elementos de página. Este comportamiento resulta útil para mostrar información a medida que el usuario va interactuando con la página. Por ejemplo, cuando el usuario pasa el puntero por encima de la imagen de una planta, se puede mostrar un elemento de página que le ofrezca información sobre la época y región de crecimiento de la planta, las horas de sol que necesita, el tamaño que suele alcanzar, etc. El comportamiento solo muestra u oculta el elemento correspondiente (no elimina realmente el elemento del flujo de la página cuando está oculto).

Este comportamiento ha dejado de utilizarse a partir de Dreamweaver CS5.

Aplicación del comportamiento Intercambiar imagen

El comportamiento Intercambiar imagen intercambia una imagen por otra cambiando el atributo src de la etiqueta <img>. Use este comportamiento para crear sustituciones de botones y otros efectos de imágenes (incluido el intercambio de varias imágenes a la vez). Al insertar una imagen dinámica se añade automáticamente un comportamiento Intercambiar imagen a la página.

También existe un comportamiento denominado Restaurar imagen intercambiada que restaura el último conjunto de imágenes intercambiadas a sus archivos de origen anteriores. Este comportamiento se añade automáticamente siempre que se adjunta el comportamiento Intercambiar imagen a un objeto; si dejó seleccionada la opción Restaurar al adjuntar Intercambiar imagen, no tendrá que seleccionar manualmente el comportamiento Restaurar imagen intercambiada.

Aplicación del comportamiento Validar formulario

El comportamiento Validar formulario comprueba el contenido de los campos de texto especificados para asegurarse de que el usuario ha introducido el tipo correcto de datos. Adjunte este comportamiento a campos de texto individuales con el evento onBlur para validar los campos conforme el usuario vaya rellenando el formulario, o adjúntela al formulario con el evento onSubmit para evaluar varios campos de texto cuando el usuario haga clic en el botón Enviar. Al adjuntar este comportamiento a un formulario se evita el envío de formularios con datos no válidos.