Comment intégrer un fichier SWF dans une page HTML?
Comment intégrer un fichier SWF dans une page HTML?
13 réponses
La meilleure approche pour intégrer un SWF dans une page HTML est d'utiliser SWFObject .
C'est une bibliothèque JavaScript open-source simple qui est une méthode facile à utiliser et conviviale pour intégrer du contenu Flash.
Il offre également la détection de version 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 que l'utilisateur a mis à niveau, ils serez redirigé vers la page.
Un exemple 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>
Un bon outil à utiliser avec ceci est le générateur SWFObject HTML et JavaScript . Il génère essentiellement le code HTML et JavaScript dont vous avez besoin pour intégrer le Flash à L'aide de SWFObject. Est 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 est approprié pour l'application 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 qui dépend de .swf de soi. Pas d'intégration, juste objet et paramètres à l'intérieur, donc, il reste valide, fonctionnant et utilisable partout, peu importe lequel !DOCTYPE est tout au sujet. :)
Que diriez-vous d'intégrer une simple balise HTML5?
<!DOCTYPE html>
<html>
<body>
<embed src="anim.swf">
</body>
</html>
Si vous utilisez L'une de ces bibliothèques js pour insérer Flash, je suggère d'ajouter une balise d'intégration d'objet simple à l'intérieur de <noscript/>
.
<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>
J'utilise http://wiltgen.net/objecty / , il aide à intégrer le contenu multimédia et éviter le problème IE "Cliquez pour activer".
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">
Quelle est la meilleure façon? Des mots comme "le plus efficace", "le rendu le plus rapide", etc. sont plus spécifiques. Quoi qu'il en soit, j'offre une réponse alternative qui m'aide la plupart du temps (que ce soit ou non "meilleur" n'est pas pertinent).
Autre réponse: utilisez un iframe.
C'est-à-dire héberger le fichier SWF sur le serveur. Si vous placez le fichier SWF dans le dossier root ou public_html, le fichier SWF sera situé à www.YourDomain.com/YourFlashFile.swf
.
Ensuite, sur votre index.html ou n'importe où, liez l'emplacement ci-dessus à votre iframe et il sera affiché autour de votre contenu où vous mettez votre iframe. Si vous pouvez y mettre un iframe, vous pouvez y mettre un fichier SWF. Faites les dimensions iframe les mêmes que 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 intégrera votre fichier SWF. Aucun autre gâchis nécessaire.
Avantages: conforme au W3C, conception de page conviviale, Pas de problème de vitesse, approche minimaliste.
Inconvénients: espace blanc autour de votre fichier SWF lorsqu'il est lancé dans un navigateur.
C'est une autre réponse. 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 avec, 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 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>