Dans le mode Création ou Code de votre document Dreamweaver, sélectionnez l'élément auquel vous souhaitez appliquer un effet jQuery.
Dernière mise à jour le
10 déc. 2018
Concevez des sites web engageants en utilisant les effets jQuery. L’intégration de Dreamweaver avec jQuery vous permet d’inclure des effets tels que les curseurs sans devoir écrire de code.
Ajout d'effets jQuery
Choisissez Fenêtre > Comportements afin d'ouvrir le panneau Comportements.
Cliquez sur l'icône Plus, cliquez sur Effets, puis cliquez sur l'effet requis.
Le panneau de personnalisation s'affiche et présente les paramètres de l'effet sélectionné.
Spécifiez les paramètres, tels que l'élément cible auquel l'effet doit s'appliquer, ainsi que la durée de l'effet.
L'élément cible peut être le même que l'élément sélectionné initialement ou un autre élément de la page. Par exemple, si vous souhaitez que les utilisateurs puissent cliquer sur un élément A pour afficher ou masquer un élément B, l'élément cible est B.
Pour ajouter plusieurs effets jQuery, répétez les étapes ci-dessus.
Lorsque vous sélectionnez plusieurs effets, Dreamweaver les applique dans l'ordre où ils sont affichés dans le panneau Comportements. Pour modifier l'ordre des effets, utilisez les touches fléchées dans la partie supérieure du panneau.
Dreamweaver insère automatiquement le code approprié dans votre document. Par exemple, si vous avez sélectionné l’effet Fondu, le code suivant est inséré :
- Références de fichiers externes pour les fichiers dépendants nécessaires au bon fonctionnement des effets jQuery :
<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>
- Le code suivant s'applique à l'élément dans la balise body :
<li id="earthFrm" onclick="MM_DW_effectAppearFade($('#earthForms'),'show','fade',1000)"> Earth Forms</li>
- Une étiquette de script avec le code suivant est ajoutée :
<script type="text/javascript"> function MM_DW_effectAppearFade(obj,method,effect,speed) { obj[method](effect, {}, speed); }</script>
Effets jQuery basés sur un événement
Lorsque vous appliquez un effet jQuery, il est attribué par défaut à l’événement onClick. Vous pouvez modifier l'événement déclencheur de l'effet à l'aide du panneau Comportements.
Sélectionnez l'élément de page requis.
Dans le panneau Fenêtre > Comportements, cliquez sur l'icône Afficher les événements définis.
Cliquez sur la ligne correspondant à l'effet qui est actuellement appliqué. Notez que la première colonne devient une liste déroulante qui contient la liste des événements que vous pouvez choisir.
Cliquez sur l'événement désiré.
Suppression d'effets jQuery
Sélectionnez l'élément de page requis.
Le panneau Comportements répertorie tous les effets qui sont actuellement appliqués à l'élément de page sélectionné.
Cliquez sur l'effet que vous souhaitez supprimer, puis cliquez sur l'icône Supprimer.
Créez de magnifiques sites web dans Dreamweaver
Concevez, codez et gérez des sites web dynamiques dans un puissant outil tout-en-un.
