Comment incorporer un fichier SWF dans une page HTML?
Comment intégrer un fichier SWF dans une page HTML?
La meilleure approche pour intégrer un fichier SWF dans une page HTML consiste à utiliser SWFObject .
Il s'agit d'une simple bibliothèque JavaScript open source qui est une méthode facile à utiliser et conforme aux normes pour incorporer du contenu Flash.
Il offre également la détection de version de Flash player. Si l'utilisateur n'a pas la version de Flash requise ou si JavaScript est désactivé, il verra un autre contenu. Vous pouvez également utiliser cette bibliothèque pour déclencher une mise à niveau de Flash Player. Une fois l'utilisateur mis à niveau, il sera redirigé vers la page.
Un exemple tiré de la documentation:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>SWFObject dynamic embed - step 3</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0");
</script>
</head>
<body>
<div id="myContent">
<p>Alternative content</p>
</div>
</body>
</html>
SWFObject HTML et JavaScript generator est un bon outil à utiliser. En gros, il génère le code HTML et le code JavaScript dont vous avez besoin pour intégrer Flash à l'aide de SWFObject. Livré avec une interface utilisateur très simple pour vous d'entrer vos paramètres.
Il est fortement recommandé et très simple à utiliser.
<object width="100" height="100">
<param name="movie" value="file.swf">
<embed src="file.swf" width="100" height="100">
</embed>
</object>
Ceci convient aux applications de l'environnement racine.
<object type="application/x-shockwave-flash" data="/dir/application.swf"
id="applicationID" style="margin:0 10px;width:auto;height:auto;">
<param name="movie" value="/dir/application.swf" />
<param name="wmode" value="transparent" /> <!-- Or opaque, etc. -->
<!-- ↓ Required paramter or not, depends on application -->
<param name="FlashVars" value="" />
<param name="quality" value="high" />
<param name="menu" value="false" />
</object>
Des paramètres supplémentaires doivent être/peuvent être ajoutés, ce qui dépend de .swf lui-même. Aucun embed , juste objet et paramètres à l'intérieur, donc, il reste valide, fonctionne et peut être utilisé partout, peu importe le type! :)
Que diriez-vous d'une simple balise HTML5?
<!DOCTYPE html>
<html>
<body>
<embed src="anim.swf">
</body>
</html>
<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/VhtIydTmOVU&hl=en&fs=1&color1=0xe1600f&color2=0xfebd01"
style="width:640px;height:480px;margin:10px 36px;">
<param name="movie" value="http://www.youtube.com/v/VhtIydTmOVU&hl=en&fs=1&color1=0xe1600f&color2=0xfebd01" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="wmode" value="opaque" />
<param name="quality" value="high" />
<param name="menu" value="false" />
</object>
Si vous utilisez l'une de ces bibliothèques js pour insérer Flash, je suggère d'ajouter une balise incorporée à un objet simple dans <noscript/>.
Celui-ci fonctionnera, j'en suis sûr!
<embed src="application.swf" quality="high" pluginspage="http://www.macromedia.com/go/getfashplayer" type="application/x-shockwave-flash" width="690" height="430">
J'utilise http://wiltgen.net/objecty/ , cela aide à incorporer le contenu multimédia et à éviter le problème de IE "cliquer pour activer".
Comme mentionné, SWF Object est génial. UFO mérite également le détour
Quel est le meilleur moyen? Des mots comme «le plus efficace», «le rendu le plus rapide», etc. sont plus spécifiques. Quoi qu'il en soit, je propose une réponse alternative qui m'aide la plupart du temps (que ce soit ou non "le mieux" est sans importance).
Réponse alternative: Utilisez un iframe.
Autrement dit, hébergez le fichier SWF sur le serveur. Si vous placez le fichier SWF dans le dossier racine ou public_html, le fichier SWF sera situé à www.YourDomain.com/YourFlashFile.swf.
Ensuite, sur votre index.html ou ailleurs, liez l’emplacement ci-dessus à votre iframe et il sera affiché autour de votre contenu où que vous placiez votre iframe. Si vous pouvez y placer un iframe, vous pouvez également y placer un fichier SWF. Faites en sorte que les dimensions de l’iframe soient identiques à celles de votre fichier SWF. Dans l'exemple ci-dessous, le fichier SWF est 500 par 500.
Pseudo code:
<iframe src="//www.YourDomain.com/YourFlashFile.swf" width="500" height="500"></iframe>
La ligne de code HTML ci-dessus incorporera votre fichier SWF. Aucun autre désordre nécessaire…. Avantages: conforme à W3C, conception de page conviviale, pas de problème de vitesse, approche minimaliste.
Inconvénients: l’espace vide autour du fichier SWF lorsqu’il est lancé dans un navigateur.
C'est une réponse alternative. Que ce soit la "meilleure" réponse dépend de votre projet.
Je sais que c'est une vieille question. Mais cette réponse sera bonne pour le présent.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>histo2</title>
<style type="text/css" media="screen">
html, body { height:100%; background-color: #ffff99;}
body { margin:0; padding:0; overflow:hidden; }
#flashContent { width:100%; height:100%; }
</style>
</head>
<body>
<div id="flashContent">
<object type="application/x-shockwave-flash" data="histo2.swf" width="822" height="550" id="histo2" style="float: none; vertical-align:middle">
<param name="movie" value="histo2.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffff99" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<a href="http://www.Adobe.com/go/getflash">
<img src="http://www.Adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
</object>
</div>
</body>
</html>
Vous pouvez utiliser JavaScript si vous êtes familier, comme ça:
swfobject.embedSWF("filename.swf", "Title", "width", "height", "9.0.0");
--le 9.0.0 est la version flash.
Ou vous pouvez utiliser la balise <object> de HTML5.
Cela fonctionne sur IE, Edge, Firefox, Safari et Chrome.
<object type="application/x-shockwave-flash" data="movie.swf" width="720" height="480">
<param name="movie" value="movie.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<a href="http://www.Adobe.com/go/getflash">
<img src="http://www.Adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
</object>
Cela a fonctionné pour moi:
<a target="_blank" href="{{ entity.link }}">
<object type="application/x-shockwave-flash" data="{{ entity.file.path }}?clickTAG={{ entity.link }}" width="120" height="600" style="visibility: visible;">
<param name="quality" value="high">
<param name="play" value="true">
<param name="LOOP" value="false">
<param name="wmode" value="transparent">
<param name="allowScriptAccess" value="true">
</object>
</a>