Tutorial FrontPage

Roll-over en série

1 Facile de créer des roll-over à l'aide de liens hypertextes, ou d'images. Mais comment faire des choses plus élaborées sur FrontPage sans copier coller des javascripts ici et là sur le web. Eh bien c'est encore plus simple que sur DreamWeaver.

2 Pour commencer créez un tableau qui va comporter vos différents liens. Chacun isolé dans une cellule différente. Tableau/Insérer un tableau… J'ai choisi une marge intérieure des cellules de 1 point et c'est tout. A l'aide du bouton droit de la souris j'ai modifié les propriétés de tableau pour un arrière plan noir, et de la même manière j'ai mis un arrière plan de cellule blanc. Bien sur pour sélectionner les deux cellules j'ai maintenu la touche AltGr+Clic.

3 Nous allons créer dans un premier temps un roll-over de cellule : au passage de la souris (survol) la cellule change d'aspect. Cliquez dans la cellule concernée et allez dans le menu Format/Effet DHTML Dans la palette horizontal qui s'affiche indiquez les paramètres ci-contre. A ceci près qu'en choisissant bordure activez l'onglet trame de fond. Vous pouvez aussi personnaliser la police pour qu'elle change d'état au survol elle aussi.

4 Le problème est que nous n'avons toujours pas d'index par défaut, je vous rappelle que ce sont des liens : a vous de les créer. Une fois les liens crées le roll-over sur le texte ne fonctionne plus (?) FrontPage distingue les liens d'une part du texte d'autre part.

5 Passez dans les propriétés de la page : Fichier/Propriétés… Dans l'onglet arrière plan cochez Activez les effets de substitution… puis sur le bouton Style de substitution… pour procéder aux changements d'état du survol des liens de la page !
Un fichier animate.js est crée dans votre site qui contient les paramètres de roll-over ne le supprimez pas !! C'est d'autant mieux que votre page ne pèsera pas plus lourd. C'est un travail impeccable.