DREAMWEAVER Partie 2.

Présentation au sujet: "DREAMWEAVER Partie 2."— Transcription de la présentation:

1 DREAMWEAVER Partie 2

2 Les Calques (layers) Définition:
Les calques sont le moyen de réaliser avec précision le positionnement d'éléments textuels ou graphiques sur la page en création (coordonnées pixels). Leur utilisation sert en outre à afficher ou masquer ces éléments à volonté.

3 Positionnement du calque :
G : position par rapport au bord gauche de la fenêtre S : position par rapport au bord supérieur de la fenêtre L : largeur du calque H : hauteur du calque Visibilité du calque : defaut : en général visible visible : le calque est affiché hidden : le calque n'est pas affiché

4 Aligner les calques Z = 1 Z = 2 Code
sélectionner les calques en maintenant shift appuyé Menu Modifier > aligner > haut, bas gauche, droite autres outils La grille de positionnement : affichage > grille > afficher la grille La règle de positionnement : affichage > règle > afficher Code Un calque se traduit par une balise <div></div> en code HTML : <div id="Layer1" style="position:absolute; left:54px; top:355px; width:192px; height:52px; z-index:1; visibility: hidden;"> ceci est un calque contenant du texte</div>

5 Les comportements Dreamweaver met à disposition des comportements qui permettent de réaliser de l'animation ou de l'interactivité dans la page en création. En général, le comportement est associé à un événement, et il réalise l'exécution d'un code Javascript inclu dans la page, et qui s'exécute donc au niveau du navigateur client (et non pas sur le serveur web). Les comportements sont utilisables à partir de la fenêtre d'onglet (panneau) "Comportements" (shift+F3).

6 Pour ajouter un comportement
Comportement ajouté Pour supprimer un comportement appliqué sur un élément de page, sélectionner l'élément, sélectionner le comportement dans le panneau "Comportements", puis cliquer sur le bouton "-" en haut à gauche du panneau. Pour modifier un comportement appliqué sur un élément de page, sélectionner l'élément, double-cliquer le comportement dans le panneau "Comportements", puis modifier les paramètres nécessaires.

7 onAbort Lorsque l'utilisateur appuie sur le bouton stop du navigateur, alors que tout n'est pas encore chargé. onBlur Lorsque l'élément perd le focus. onChange Lorsque la valeur de l'élément est modifiée onClick Lorsque l'utilisateur clique sur un élément onDblClick Lorsque l'utilisateur clique deux fois sur un élément onError Est approprié pour capter les messages d'erreur et les remplacer par des messages personnalisés onFocus Lorsque l'utilisateur active un élément. onKeydown Lorsque l'utilisateur appuie sur une touche onKeypress Lorsque l'utilisateur maintient une touche appuyée onKeyup Lorsque l'utilisateur relâche une touche onLoad Entre en action quand un fichier HTML est chargé. onMouseDown Lorsque l'utilisateur maintient la touche de souris appuyée. onMouseMouve Lorsque l'utilisateur bouge la souris sur l'élément onMouseOver Lorsque l'utilisateur passe sur l'élément avec la souris onMouseUp Lorsque l'utilisateur, après avoir appuyé la touche de souris, la relâche. onSelect Lorsque l'utilisateur saisit du texte onSubmit Lors de l'envoi du formulaire

8 Le scénario A quoi ça sert? Objets en jeu Principe
Les scénarios permettent de créer des animations simples sans l’utilisation de JAVA script. Ils permettent de modifier la position, la taille, la visibilité, l’ordre de superposition des objets. Objets en jeu Calques, sons, images, comportements. Principe Dynamique image par image avec interpolation Comparable à celui déjà vu pour Flash

9 Nombre d’images par seconde
Défilement avant/arrière image par image Tête de lecture rembobiner Nombre d’images par seconde Canaux d’animation Images clés Fenêtre > Autres > Scénarios ou ALT+F9

10 Les modèles On crée un modèle pour l'utiliser lors de la création de pages qui ont des caractéristiques communes. Ultérieurement, lorsque le modèle est mis à jour, toutes les pages composées suivant ce modèle sont mises à jour également. Ceci permet de réaliser des mises à jour massives d'un ensemble de pages d'un site.

11 Ajouter une région modifiable
Tableau répété Par défaut, tout ce qui est contenu dans un modèle se retrouve non modifiable dans la page créée sur ce modèle. Pour pouvoir rendre des zones modifiables dans les pages créées sur le modèle, il faut définir dans le modèle des "régions modifiables" Il est possible de définir des régions répétées, dont le but est de spécifier des éléments dans le modèle, et de reproduire à volonté ces éléments dans la page créée sur ce modèle.

12 Pour créer une page suivant un modèle existant, utiliser la commande : Fichier > Nouveau ... puis dans l'onglet "modèles" choisir le site et le modèle désiré à appliquer à la nouvelle page. Il est possible d'appliquer un modèle à une page déjà créée sans modèle ; utiliser la commande : Modifier > Modèle > Appliquer le modèle à la page ... puis choisir le site et le modèle à appliquer Pour mettre à jour un ensemble de pages construites sur un modèle, ouvrir le modèle : Fichier > Ouvrir ...

13 Les Formulaires Deux possibilités Insertion > formulaire
Barre d’insertion > formulaires >

14 Nom du formulaire Fichier qui traitera le formulaire Méthode d’envoi du formulaire (Get ou Post) Les méthodes d’envoi - Post : envoyé par protocole HTTP - Get : passé par URL

15 ! il faut insérer les objets dans le formulaire sinon ils n’apparaîtront pas en tant qu’objet du formulaire Menu / liste Champ caché Bouton Case à cocher Bouton radio Image Formulaire Zone de texte Texte Reroutage Fichier Étiquette

16 EXERCICE