Avant-Goût Studios / Développeur web / Programmation Actionscript 3, Flex, Air / Intégration XHTML CSS / développement internet, PHP MySQL, AJAX, JQuery / Centre de formation à l’informatique et aux technologies web.

Comment ouvrir une animation flash en plein écran (vidéo ou animation simple) ?

5 mars 2008 – 16:19

Comment ouvrir une vidéo en plein écran dans mon site, comme le font youtube et dailymotion ?
J’ai au départ cherché du côté d’un popup javascript avec mon flash à l’intérieur qui se redimensionnerait pour afficher un plein écran trafiqué …. Pourquoi se compliquer la vie alors que l’actionscript nous propose tout ça ?

En effet actionscript vous permet d’afficher une animation de votre site web en plein écran. Et ça ne se limite pas aux vidéos flv, ça marche sur toute sorte d’animation.

Méthode :

Insérez l’occurence d’un DisplayObject (simplebutton,movieclip,sprite) sur votre scène (n’oubliez pas de la nommer).
Créez un évènement de click sur ce DisplayObject, et lancez la commande stage.displayState=StageDisplayState.FULL_SCREEN; à l’exécution de l’évènement.
Ensuite passez l’option allowFullScreen sur true dans le code html de votre page web.

C’est tout …

Le code actionscript :

  1.  
  2. // boutonPleinEcran est le nom de l’occurrence du bouton sur la scène
  3.  
  4. boutonPleinEcran.addEventListener(MouseEvent.CLICK, ouvrePleinEcran);
  5.  
  6. function ouvrePleinEcran (ev:MouseEvent){
  7.  
  8. stage.displayState = StageDisplayState.FULL_SCREEN;
  9.  
  10. }

Le code HTML :

  1.  
  2. <param name="allowFullScreen" value="true" />
  3. et
  4. <embed … allowFullScreen="true" />
  5.  

L’animation en image :



Cliquez ici pour télécharger les fichiers sources : flash-fullscreen.zip

Postez un commentaire


Comments links could be nofollow free.