En la vista Diseño o Código de su documento de Dreamweaver, seleccione el elemento al que desea aplicar un efecto jQuery.
Diseñe sitios webs atractivos con los increíbles efectos de jQuery. La integración de Dreamweaver con jQuery le permite incluir efectos como reguladores sin tener que escribir código.
Adición de efectos jQuery
Seleccione Windows > Comportamientos para abrir el panel Comportamientos.
Haga clic en el icono Más, haga clic en Efectos y, a continuación, haga clic en el efecto requerido.
Aparecerá el panel de personalización con la configuración del efecto seleccionado.
Especifique la configuración, por ejemplo, el elemento de destino al que debe aplicarse el efecto y la duración del efecto.
El elemento de destino puede ser el mismo que el elemento que seleccionó inicialmente o un elemento diferente de la página. Por ejemplo, si desea que los usuarios hagan clic en un elemento A para ocultar o mostrar un elemento B, el elemento de destino es B.
Para añadir varios efectos jQuery, repita los pasos anteriores.
Al elegir varios efectos, Dreamweaver aplica los efectos en el orden en el que se muestran en el panel Comportamientos. Para cambiar el orden de los efectos, utilice las teclas de flecha situadas en la parte superior del panel.
Dreamweaver inserta automáticamente el código correspondiente en el documento. Por ejemplo, si ha seleccionado el efecto “Desvanecer”, se insertará el siguiente código:
- Referencias de archivos externos para los archivos dependientes necesarios para que los efectos de jQuery funcionen:
<script src="jQueryAssets/jquery-1.7.2.min.js" type="text/javascript"></script><script src="jQueryAssets/jquery-ui-effects.custom.min.js" type="text/javascript"></script>
- El siguiente código se aplica al elemento en la etiqueta body:
<li id="earthFrm" onclick="MM_DW_effectAppearFade($('#earthForms'),'show','fade',1000)"> Earth Forms</li>
- Se añade una etiqueta script junto con el siguiente código:
<script type="text/javascript"> function MM_DW_effectAppearFade(obj,method,effect,speed) { obj[method](effect, {}, speed); }</script>
Efectos jQuery basados en eventos
Cuando se aplica un efecto jQuery, se asigna al evento onClick de forma predeterminada. Puede cambiar el evento desencadenante del efecto mediante el panel Comportamientos.
Seleccione el elemento de página requerido.
En Ventanas > panel Comportamientos, haga clic en el icono Mostrar eventos establecidos.
Haga clic en la fila correspondiente al efecto que se aplica en ese momento. Tenga en cuenta que la primera columna cambia a una lista desplegable que proporciona una lista de eventos entre los que elegir.
Haga clic en el evento requerido.
Eliminación de efectos jQuery
Seleccione el elemento de página requerido.
El panel Comportamientos muestra todos los efectos actualmente aplicados al elemento de página seleccionado.
Haz clic en el efecto que quieres eliminar y, a continuación, haz clic en el icono Eliminar.
Crear sitios web atractivos en Dreamweaver
Diseña, codifica y gestiona sitios web dinámicos en una potente herramienta todo en uno.