Voici comment créer un menu en flash en reprenant, pour exemple, ces graphismes : http://www.wks.fr/Creer-un-menu-black-gloss-decoupe.html
J’aurai besoin de l’ensemble des images qui forment le menu : les extrémités simples, les boutons noirs et oranges. Ce n’est pas la meilleure façon de faire un menu sous Flash mais vous pourrez voir l’utilisation du symbole bouton ainsi qu’un bout de code Action-Script.

Etape 1 :

1. Je crée un nouveau document, et je lui donne une nouvelle dimension dans le panneau des propriétés ( je prends en compte la hauteur et la largeur de l’ensemble de mon menu), dans mon cas j’obtiens 473x70.
2. Puis j’ouvre la bibliothèque de mon document : Menu Fenêtre > Bibliothèque (ou raccourci clavier Ctrl +L)
3. Ainsi je peux importer l’ensemble des images qui forment mon menu dans ma bibliothèque : Menu Fichier > Importer > Importer dans la bibliothèque. Elles apparaissent dans le panneau bibliothèque.
4. J’ouvre un autre panneau qui sera utile : Menu fenêtre > Panneau de conception graphique > Aligner (raccourci clavier Ctrl +K) .
Etape 2 :

1. Dans le panneau bibliothèque, je choisis l’embout gauche de mon menu que je fais glisser - déplacer vers mon document. Grâce au panneau Aligner, je le positionne parfaitement en choisissant aligner les bords gauches et verticalement par rapport au centre. Je fais la même chose avec l’embout de droite que je fais glisser - déplacer vers mon document. Je le positionne parfaitement en choisissant aligner les bords droits et verticalement par rapport au centre.
2. Puis, je choisis l’image de mon 1er bouton noir que je fais glisser - déplacer vers mon document. Toujours grâce au panneau Aligner, je le positionne verticalement par rapport au centre ensuite je le déplace vers l’image de l’embout de gauche jusqu’à voir apparaître des pointillés verticalement et horizontalement, ainsi mon image est parfaitement positionnée.
3. Voila, je fais la même chose, pour l’ensemble de mes images des boutons noirs. Si j’ai bien dimensionné mon document, tout rentre et rien ne dépasse ![]()
Etape 3 :

1. Avec l’outil de sélection (raccourci clavier : V), je sélectionne mon 1er bouton sur le document, puis je vais le convertir en symbole : Clic droit > convertir en symbole … (raccourci clavier F8)
2. La fenêtre convertir en symbole apparaît : je lui donne un nom (par exemple : accueil) et un comportement, dans notre cas c’est Bouton, puis je clique sur OK. Le symbole du bouton accueil fait son apparition dans le panneau bibliothèque.
Etape 4 :

1. Maintenant, je fais un double-clic sur mon symbole accueil. La TimeLine a légèrement changé. Dans la zone A, je peux voir les 4 états de mon bouton :
Je vais sélectionner l’image qui est sous l’état « Dessus », faire un clic-droit et Insérer une image-clé, j’ai créé une nouvelle image identique à la précédente, nous allons voir comment la changer.
2. Tout en restant sur l’état « Dessus », je sélectionne l’image de mon bouton. Apparaît dans le panneau des propriétés, l’option Permuter qui me permet d’échanger avec l’image dans la bibliothèque du bouton orange pour créer l’effet de RollOver au passage de la souris.
3. Je retourne à la séquence de mon menu grâce au bouton précédent, et je test mon animation (raccourci clavier Ctrl + Entrée) et j’admire le travail (enfin normalement)
Etape 5 :

1. Je vais attacher une adresse Internet à mon bouton, pour cela, je sélectionne mon bouton et j’ouvre le panneau d’action-script pour y rajouter ce code (attention n’oubliez rien, ni ; ni parenthèses, ni guillemets ) :

Le code n’est pas dur à comprendre, lorsque je clique sur le bouton -on(release)- aller à l’adresse –getURL- « index.html » sans ouvrir de nouvelle page -« _self »- (si j’avais voulu ouvrir une nouvelle page, je l’aurais remplacée par « _blank »)
2. Je teste à nouveau mon animation pour voir le résultat, voir si tout fonctionne, je fais la même chose avec les boutons restants, en repartant de l’étape 3.
Conclusion :
J’espère que vous aurez maintenant compris comment utiliser un bouton sous Flash, le site ne manque pas d’exemples de menu HTML à reconvertir en Flash ![]()
Post-Scriptum : Ce tutorial a été effectué sous Flash MX 2004, certains menus ou fenêtres peuvent être différents de la version Flash 8, mais rien de dramatique, les raccourcis clavier et le fonctionnement des boutons restent inchangés.

Vous aimez cet article? Partagez le !
Adepte de Photoshop et Flash depuis de nombreuses années. J’aime faire partager mes connaissances avec le plus grand nombre.
Pour en savoir plus : Mon Portfolio
Voici les images déjà publiées par les membres de ce site, merci à vous pour votre créativité !
Vous avez besoin d’eclaircicemment sur un points évoqués dans cette leçon, dans ce cas laissez votre question en utilisant le formulaire ci dessous, notre équipe vous apportera rapidement un complètement d’information. Merci d’être le plus précis possible lors de la rédaction de votre demande.
Bonjour, Je viens régulièrement consulter le site et j’en suis satisfait à chaque fois.
Je me demandais quand nous allions avoir du flash mais là vous avez comblé mes attentes.
Merçi à vous,
RépondreMerci pour ces tutos qui servent pour un debutant comme moi !
Serait il possible d’en avoir un sur l’explication des actions scripts car je nage ... glou glou glou ... :d ^^
RépondreTu veux plus de détail pour ce tutorial ou en général ? Pour le tutorial, je ne peux pas faire plus simple ... sinon l’ActionScript est le langage de programmation utilisé par Flash, Ce langage permet d’ajouter de l’interactivité aux animations Flash, en répondant aux actions de l’utilisateur, et en pilotant les movie clip, et les différents objets multimédias (images, son, vidéo, ...) la suite : Wikipedia
Voir en ligne : http://mog007.free.fr
RépondreBonjour, je suis bien arriver a suivre ton tutoriel jusqu’où il faut mettre l’action scipt, je dispose de Flash CS3, et il me dit qu’il y a des erreurs...
Merci pour ton aide !
Répondremarche pas,s bah tu vois, a la fin, a ala 3eme ligne, bah des que je les enleves, il n’y a plus d’erreurs.
RépondreVoila exactement la description : 1087 : Erreur de syntaxe : caractères excédentaires détectés après la fin du programme.
RépondreJe suis en train de me renseigner sur L’action-Script 3, on ne peut plus placer les scripts sur un Clip, il faut forcément le faire dans une frame sur la timeline.
plus d’info : Forum Adobe MédiaBox Flash
RépondreSalut, j’ai regarder sur ton forum, mais je ne comprend pas tout, je ne connais pas du tout le Flash, donc je n’y arrive toujours pas, même avec l’aide du forum . . . Si ta une idée :D
RépondreBien dés que j’ai le temps je trouve une version demo de Flash CS 3 et met une explication avec plus de détails dans les commentaires.
RépondreBonjour, serait-il possible de savoir qu’elle est la police d’écriture utilisé dans chaque titre de se menu en flash ? Je n’ai pas la police d’écriture et je souhaiterai rajouter d’autre onglet.
RépondreIl faut poser la question dans les commentaires de la création de ce menu avec Photoshop : Créer un Menu black Gloss + decoupe Mais tu n’as qu’a prendre une police qui s’en rapproche.
Voir en ligne : http://mog007.free.fr
RépondreNon c’est bon, j’ai trouver grace à photoshop, par contre sa m’interresserai également d’avoir la méthode pour flash CS3
Merci d’avance
Désolé du double post mais je ne peut pas éditer mon commentaire, j’ai le même problème que d’autre avec Flash CS3 c’est à dire que je ne peut pas faire l’étape 5, à savoir attacher une adresse Internet à un bouton. C’est donc pour cela qu’un tuto pour cet étape m’interresserai
.
Mais j’aurais voulu savoir si il serait possible de faire un effet de fondu lorsqu’on passe la souri sur le bouton et lorsque l’on sort de la zone du bouton
ce qui serai très joli. Merci
Je pense qu’il faut pas attacher une url à un bouton mais lui attacher une ligne d’action script. menu fenètre > action script et lui ajouter un geturl ! Se doit être quelque chose comme cela !
RépondreMerci de ton aide mais je ne trouve pas la ligne d’action script sur CS3 qu’il faut et vu que je débute c’est encore moin évidant. Je ne sait pas comment ajouter un get url =(
RépondreEn fait faut tapper le code dans une fenètre dans flash, pour le code exact tappe geturl flash as dans google
tu trouverais plein de chose !
Pour répondre à la question sur l’effet de fondu lors du passage de la souris. C’est possible mais pas sur ce tutorial puisqu’il reprend des créations faites sous Photoshop.
Pour le faire il faut intégrer un MovieClip sur le bouton et programmer avec l’Action-Script son comportement avec un RollOver() et un RollOut().
Peut être un prochain Tuto ![]()
J’ai trouvé une solution ![]()
L’étape 5 de ce tutorial pose problème aux possesseurs de Flash Cs3 a cause du changement de syntaxe de l’AS 3.0 (AS = Action Script) qui ne prend pas en compte la fct GetURL(). Pour cela lors que la création d’un document Flash on a le choix entre créer un Fichier Flash (AS 3.0) ou un Fichier Flash (AS 2.0). Il faut donc choisir de créer un Fichier Flash (AS 2.0) qui prendra en compte la fonction GetURl().
Je vais aussi donner plus de détail sur l’étape 5 : Il faut sélectionner le bouton puis ouvrir le panneau Action (raccourci clavier : F9), c’est dans se panneau que l’on tape le code Action-Script comme indiqué.
Voila désolé de ne pas avoir pensé à Flash CS3 et je vais chercher une méthode pour le code AS 3.0
RépondreD’accord merci beaucoup pour ta recherche =D et merci de m’avoir répondu au sujet du fondu
Je réserverai sa pour plus tard et je vais recommencer avec AS 2.0 !
Et sa ne fais rien
tu ne pouvais pas savoir que c’était différent !
Voila tout marche en AS 2.0 =D
Merci beaucoup pour ce superbe tuto,
J’espère qu’un petit tuto sur les effets de fondu pourra voir le jour un jour =P lol ![]()
Super ![]()
Montre nous ta création quant tu pourras ![]()
Voir en ligne : http://mog007.free.fr
RépondreJ’aurais bien aimé mettre ma création mais il y a une erreur : your picture must be with an jpeg extension ! Pourtant mon image est en JPEG et elle fait 22ko.
Décidément :$
RépondreA propos de l’AS3, j’ai demander une petite aide au départ sur un forum et la personne m’a bien détaillée les explications pour l’AS3 également :
http://flashaddict.rabou.eu/viewtopic.php ?f=16&t=184&p=971#p971
Voila
RépondreDésolé pour le lien qui ne fonctionne pas voici le bon :
http://flashaddict.rabou.eu/viewtopic.php ?f=16&t=184
RépondreVoila enfin ma méthode pour attacher une adresse Internet à un bouton avec FLASH CS3 en AS 3.0 :
1. Sélectionner le bouton pour lui donner un Nom d’occurrence, le nom d’occurrence permet d’identifier le Bouton dans l’AS.
2. Créer un nouveau calque, que j’ai nommer Script.
3.Dans ce même calque, j’ouvre le panneau Action (raccourci clavier : F9) et j’y tape mon code :
En gros lors que je clic sur mon Bouton Accueil (avec comme nom d’occurrence accueil) je lance la fonction boutonAccueil. Vous faite de même avec les autres boutons en changeant bien sur les noms d’occurrence et de fonction.
Encore désolé pour les problèmes lier à l’AS et désolé a Wonka pour se 1er tuto incomplet (faudrait faire une mise à jour puis supprimer les commentaires inutile)
RépondreMerci beaucoup, je confirme que sa marche maintenant en AS3 quand je fait ctrl+entrée.
Par contre j’ai un autre souci pour quelque soit la version (AS2 ou AS3) : une fois que je met la barre sur mon site, l’animation marche, mais pas les liens =S.
Quelqu’un à t-il le même problème ? Est-ce que sa pourrait provenir de mon code ?
Voir en ligne : http://pris0nbreak.fr
RépondreProblème résolu après 3 jour de recherche lOol ![]()
Merci encore pour tout et j’adore vos tutoriel
Si vous voulez voir le résultat, cliquez ci dessous
Voir en ligne : http://pris0nbreak.fr
RépondreCoucou à tous,
Mon menu flash marche super, seul soucis c’est lorsqu’on clique sur un bouton, il ouvre une nouvelle page alors que pourtant j’ai mis _self, est-ce que d’autre personne on se problème ?
Voir en ligne : http://pris0nbreak.fr
RépondreGrand merci à vous tous, voila 2 jours et demi que je me prenais la tête à essayer de mettre mes liens dans ces foutus boutons avec toujours des erreurs de syntaxes
et la, la situation s’est débloqué d’un seul coup (trop cool)
RépondreBonjour j’ai un probleme dans la fenêtre A j’ai pas les différentes catégories dessus cliquable..
merci de bien vouloir m’aidez
RépondreSalut, Tu as bien convertie ton image en symbole Bouton ? puis tu as bien fais un Double-Clic sur se même symbole nouvellement créer ?
Répondreoui j’ai effectuer sa et toujours rien Quelqu’un aurai un fichier source a m’envoyer ? team-centox@hotmail.fr
merci ![]()
jolie tuto vous avez montrez comment lier le bouton du menu a un url
comment lier un movieclip a un bouton du menu pour qu’il apparaisse quand on click un moviclip texte et image pas un .swf
merci
RépondreCoucou à tous,
Mon menu flash marche super, seul soucis c’est lorsqu’on clique sur un bouton, il ouvre une nouvelle page alors que pourtant j’ai mis _self, est-ce que d’autre personne on se problème ?
Voir en ligne : http://pris0nbreak.fr
RépondreVu la demande je vais surement faire un autre tuto sur la création d’un menu Flash plus avancé. Je cherche juste un sujet simple et plus aboutie :D
RépondreAvec Flash CS4, Je ne trouve pas le cadre TimeLine. OU est-il ?? Merci de me répondre
Répondremerci mille fois à MØG pour cet article car sans lui je crois que j’aurai encore galéré longtemps.
RépondreBonjour, c’est la première fois que je viens sur ce site et les indications pour la création du menu flash me semblent complètes et très satisfaisantes !
est-ce que quelqu’un pourrait juste m’expliquer comment faire pou créer un « menu flottant » avec flash ? je m’explique, je souhaite créer un menu (une sorte de barre avec boutons) que l’utilisateur puisse bouger sur la page quand il arrivera sur le site...
merci vraiment de m’aider ! ![]()
Salut elo333,
La technique pour déplacer un élément n’importe où sur ta page se nomme le « Drag and Drop » et voici quelques liens :
Voir en ligne : MØG Folio
RépondreBonjour, je vien de creer deux pages en flash et je voulais savoir comment faire pour placer un lien qui mene de la page 1 a la page 2, si qq peut m’aider svp , merci d’avance
RépondreSalut, moi j’ai un problème avec ce superbe tutoriel, j’utilise flash pro 8 sous mac, et quand je tape le code donné dans la fenêtre des actions, eh ben ça me dit qu’une commande est pas valide... Pourriez-vous m’éclairer dans mon brouillard ? Merci d’avance.
RépondreSalut,
Lors que la création d’un document Flash on a le choix entre créer un Fichier Flash (AS 3.0) ou un Fichier Flash (AS 2.0). Il faut donc choisir de créer un Fichier Flash (AS 2.0) qui prendra en compte la fonction GetURl().
Si le problème ne vient pas de là. Donne le résultat du Debug Mode.
Voir en ligne : MØG Folio
RépondreSalut à tous, j ai un petit soucis hum hum ! j ai crée des menus a l aide de ce superbe tuto, 3 exactement ! Le truc est que je me retrouve avec trois swf ou fla, que je dois insèrer par exemple sur une bannière d entete de blog, donc au même emplacement. Ma question est comment combiner 3 fla ou 3 swf, tous multi-cliquables sur une seule et même bannière ? Merci à tous pour votre aide et bonne continuation sur ce site ! booobooob
RépondreSalut booobooob
Je sais que l’on peut importer des fichiers swf dans un projet flash :
Menu Fichier > Importer > Importer dans la bibliothèque.
Mais s’est pas pratique, le plus simple reste de refaire t’es menus dans un seul projet flash puisque tu dis avoir les fichiers sources .fla
Bonjour, Merci pour ce tuto. C’est très bien fait et facile à réaliser.
J’aimerais savoir s’il serait possible que lorsque l’on clique sur le bouton accueil par exemple, que le bouton reste orange tant que la personne n’a pas cliqué sur un autre bouton ? Ça pourrait indiquer la page active.
Merci pour votre aide.
RépondreBonjour,
J’ai un petit soucis, nan en fait trois :
Mon menu clignote, j’ai dans l’idée que c’est la cadence qui est en cause mais je n’arrive pas à trouver quel valeur mettre.
Mes séparations disparaissent, et pourtant elle sont présente sous flash MX
Et j’ai une perte de qualité sur la tipo des boutons.
Voila si déjà je peux avoir une réponse pour l’un de ces problèmes ça serai cool.
Merci d’avance et un GRAND merci pour tous ces tutos :D
bonjour, voilà, j’ai réalisé mon menu, merci beaucoup pour cette explication assez claire et très simple. J’ai même ajouté un troisième bouton (haut, dessus et abaissé). Cependant lors de l’assemblage des différents boutons, tout se passe bien, mais c’est au niveau du script, je l’ai recopié sans erreur le voici tel qu’il est sur mon doc :
1 on (release) #crochet ouvert# 2 getURL (« http://www.monsite.com/accueil.html », « _self ») ; 3 #crochet fermé#
et le message de la console d’erreur est : 1087 : Erreur de syntaxe : caractères excédentaires détectés après la fin du programme.
Si vous avez une idée ???? Sinon, merci encore pour ce tuto bien sympathique qui permet ensuite de partir dans tout un style de variantes. PS : Pendant que j’y suis, une autre question, peut-on ajouter des sous menu sur des onglets dans ce type de menu ? A bientôtt
Répondre10319 artistes dans le club
3200 images postées dans les galeries
553 tutorials de formations Photoshop publiés


