Comportamientos en Dreamweaver |
Los comportamientos son acciones, programadas normalmente en código JavaScript, que suceden cuando los usuarios realizan algún evento sobre un objeto (en lenguaje Dreamweaver) ya sea imagen, texto, capa, ... Los comportamientos de Dreamweaver introducen en los documentos código JavaScript que permite a los visitantes interactuar con la página Web para modificarla de diversas maneras o para que se realicen determinadas tareas. Un comportamiento es una combinación de un evento con una acción que desencadena ese evento. |
El panel Comportamientos, que se puede abrir a través del menú Ventana, o pulsando Mayús+F3 o sobre el botón del lanzador. Un comportamiento se añade a un objeto especificando en primer lugar una acción y, a continuación, el evento que desencadena esa acción. |
| Estos eventos puede ser: |
| onMouseOver (pasar el ratón sobre) |
| onMouseOut (el fuera de) |
| onClic (hacer clic sobre) |
| y muchos más |
|
Algunos comportamientos no funcionan para algunos navegadores, por lo que dependiendo del navegador elegido aparecerán unos u otros comportamientos posibles. Existen comportamientos que funcionan en Internet Explorer pero no en Netscape. Una vez elegido un navegador (mostrar eventos para...) ya no es necesario volver a elegirlo las siguientes veces que se desee insertar algún comportamiento.
|
| Cada evento lleva asociada una acción. Las acciones más importantes son: |
|
|
Curiosidades en JavaScript:
Cálculo letra DNI. Calcula la letra a partir de los números del DNI.
Entrada con clave. Exige una clave para entrar a una página web. |
| Ejercicio: En cada uno de los ejemplos (acciones) localiza el evento asociado. |
Aplicación de un comportamiento
Se pueden adjuntar comportamientos al documento completo (es decir, a la etiqueta body ) o a vínculos, imágenes, elementos de formulario o cualquier otro elemento HTML. Pero no se puede adjuntar un comportamiento a texto normal. Se puede especificar más de una acción para cada evento. Las acciones tienen lugar en el orden en el que se enumeran en la columna Acciones del panel Comportamientos.
El navegador de destino que elija determina los eventos compatibles con un elemento determinado. Internet Explorer 4.0, por ejemplo, tiene una gama de eventos para cada elemento mucho más amplia que Netscape Navigator 4.0 o que la versión 3.0 de cualquier otro navegador.
Para adjuntar un comportamiento:
 Selecciona un elemento de la página, como una imagen o un vínculo. Para adjuntar un comportamiento a la página completa, haz clic en la etiqueta <body> en el selector de etiquetas, situado en la parte inferior izquierda de la ventana de documento.
Elije Ventana > Comportamientos para abrir el panel de comportamientos.
Haz clic en el botón más (+) y selecciona una acción en el menú emergente Acciones. No se pueden seleccionar las acciones que aparecen atenuadas en el menú. Pueden mostrarse atenuadas porque no exista un objeto necesario en el documento actual. Por ejemplo, la acción Controlar Shockwave o Flash aparece atenuada si el documento no contiene ningún archivo SWF Macromedia Flash o Shockwave. Si no hay eventos para el objeto seleccionado, todas las acciones aparecerán atenuadas.
Cuando se selecciona una acción, aparece un cuadro de diálogo que muestra parámetros e instrucciones para dicha acción. Introduce los parámetros de la acción y haga clic en Aceptar. Todas las acciones proporcionadas con Dreamweaver funcionan con los navegadores de la versión 4.0 y posteriores. Algunas acciones no funcionan en los navegadores antiguos.
El evento predeterminado que desencadena la acción aparece en la columna Eventos. Si no es éste el evento de desencadenamiento que desea, selecciona otro en el menú emergente Eventos. (Para abrir el menú emergente Eventos, seleccione un evento o una acción en el panel Comportamientos y haga clic en la flecha negra que señala hacia abajo y que aparece entre el nombre del evento y el nombre de la acción.)
|
Cómo adjuntar un comportamiento a un texto
No se puede adjuntar un comportamiento a texto normal. Las etiquetas como p y span no generan eventos en los navegadores, por lo que no es posible desencadenar una acción a partir de esas etiquetas.
Sin embargo, sí se puede adjuntar un comportamiento a un vínculo. Por ello, la manera más fácil de adjuntar un comportamiento a texto consiste en añadir un vínculo nulo (que no señala a nada) al texto, y luego adjuntar el comportamiento al vínculo. Tenga en cuenta que al hacerlo, el texto tendrá aspecto de vínculo. Si no desea que parezca un vínculo, puede cambiarle el color y eliminar el subrayado, pero si lo hace es posible que los visitantes del sitio no se den cuenta de que hay una razón para hacer clic en ese texto.
Para adjuntar un comportamiento al texto seleccionado:
 En el inspector de propiedades, introduce javascript:; en el cuadro de texto Vínculo. Asegúrate de incluir tanto los dos puntos como el punto y coma.
Nota: si lo deseas, como alternativa, puedes usar un signo de almohadilla ( # ) en el cuadro de texto Vínculo. El problema de usar un signo de almohadilla es que cuando un visitante hace clic en un vínculo, algunos navegadores pueden saltar a la parte superior de la página. Hacer clic en el vínculo nulo de JavaScript no produce efecto alguno en la página, por lo que la solución de JavaScript suele ser la preferible.
Con el texto todavía seleccionado, abre el panel Comportamientos (Ventana > Comportamientos).
Elije una acción en el menú emergente Acciones, introduce los parámetros de la acción y selecciona un evento que desencadene la acción.
|
Aplicación de comportamientos a imágenes
Puede aplicar cualquier comportamiento disponible a una imagen o zona interactiva de imagen. Al aplicar un comportamiento a una zona interactiva, Dreamweaver inserta el código HTML en la etiqueta area. Hay tres comportamientos que se aplican específicamente a las imágenes: Carga previa de imágenes, Intercambiar imagen y Restaurar imagen intercambiada.
Carga previa de imágenes carga en la memoria caché del navegador las imágenes que no aparecen en la página de inmediato (como aquellas que se intercambiarán por comportamientos, capas o scripts de JavaScript). Esto contribuye a evitar las demoras debidas a la descarga cuando llega el momento de que aparezcan las imágenes.
Intercambiar imagen intercambia una imagen por otra cambiando el atributo SRC de la etiqueta img . Use esta acción para crear sustituciones de botones y otros efectos de imágenes (incluido el intercambio de varias imágenes a la vez).
Restaurar imagen intercambiada restaura los archivos de origen del último conjunto de imágenes intercambiadas. Esta acción se añade automáticamente siempre que se adjunta la acción Intercambiar imagen a un objeto de forma predeterminada. No suele ser necesario seleccionarla manualmente. |
| |
|
