Como incorporar um arquivo SWF em uma página HTML?

175

Como você incorpora um arquivo SWF em uma página HTML?

html embed flash CloudMeta
fonte

Respostas:

174

A melhor abordagem para incorporar um SWF em uma página HTML é usar SWFObject .

É uma biblioteca JavaScript de código-fonte aberto simples que é um método fácil de usar e compatível com padrões para incorporar conteúdo em Flash.

Ele também oferece detecção de versão do Flash player. Se o usuário não possuir a versão do Flash necessária ou o JavaScript estiver desativado, ele verá um conteúdo alternativo. Você também pode usar esta biblioteca para acionar uma atualização do Flash player. Após a atualização, o usuário será redirecionado de volta à página.

Um exemplo da documentação:

<!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>

Uma boa ferramenta a ser usada junto com isso é o gerador de SWFObject HTML e JavaScript . Basicamente, gera o HTML e o JavaScript necessários para incorporar o Flash usando o SWFObject. Vem com uma interface muito simples para você inserir seus parâmetros.

É altamente recomendado e muito simples de usar.

Ronnie Liew
fonte
11
SWFObject é bom. Simplesmente funciona. Uma idéia ainda mais maravilhosa é usar uma rede de entrega de conteúdo para obter o javascript. Eu uso do Google ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js
Ardee Aram
Eu tive problemas com o uso da tag de objeto diretamente no IE9, mas funciona perfeitamente com o swfobject.
AndyMcKenna
Obrigado pela sua resposta. Agora você também pode sugerir um player para acessar a capacidade de reprodução juntamente com o exemplo de trabalho no próprio html. ????
Sumit Ramteke
Isso pode funcionar no sistema em que o flash player não está instalado ou é compatível com todos os navegadores.
Mohammed Javed
O projeto agora foi movido para o GitHub: github.com/swfobject/swfobject e a nova técnica para incorporar o objeto swf é:var el = document.getElementById("my-target-element"); swfobject.embedSWF("myContent.swf", el, 300, 120, 10);
Lucky
127 
<object width="100" height="100">
    <param name="movie" value="file.swf">
    <embed src="file.swf" width="100" height="100">
    </embed>
</object>
Ólafur Waage
fonte
1
Esse código não é válido para XHTML ... <embed> não deve estar dentro de uma tag de objeto.
Anheledir
59
Nenhuma especificação do usuário para ser XHTML válido, ele pediu HTML
Ólafur Waage
3
este artigo tem uma boa explicação sobre a incorporação de flash e XHTML válido. yoast.com/articles/valid-flash-embedding
Joko Wandiro
3
por que não usar dataatributo no elemento <object> ? Citação de w3c html5 docs: pelo menos um dos atributos de dados ou de tipo deve estar presente.
vladkras
@JokoWandiro, infelizmente, o link que você forneceu desapareceu. Aqui está uma versão arquivada: web.archive.org/web/20180602024700/https://yoast.com/…
Hermann.Gruber
17

Que tal uma simples tag HTML5 incorporada?

<!DOCTYPE html>
<html>
<body>

<embed src="anim.swf">

</body>
</html>
Jan Desta
fonte
13

Isso é adequado para aplicativos do ambiente raiz. 

<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>

Parâmetros adicionais devem ser / podem ser adicionados, dependendo de .swf. Sem incorporação , apenas objetos e parâmetros, portanto, permanece válido, funcionando e utilizável em qualquer lugar, não importa qual! DOCTYPE tem tudo a ver. :)

Assustador
fonte
8 
<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/VhtIydTmOVU&amp;hl=en&amp;fs=1&amp;color1=0xe1600f&amp;color2=0xfebd01" 
style="width:640px;height:480px;margin:10px 36px;">

<param name="movie" value="http://www.youtube.com/v/VhtIydTmOVU&amp;hl=en&amp;fs=1&amp;color1=0xe1600f&amp;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>
Assustador
fonte
2
Observe que os parâmetros objeto> dados e filme> valor são os mesmos. Este código deve funcionar gratuitamente para assistir e compartilhar - vídeo do youtube.
Spooky
3
De um modo geral, é desejável que as respostas expliquem o código fornecido, em vez de apenas soltar o código no solicitante. O objetivo é aprender sobre os problemas e evitá-los no futuro, em vez de fazê-los desaparecer.
KRyan #
7

Se você estiver usando uma dessas bibliotecas js para inserir o Flash, sugiro adicionar a tag embed de objeto simples dentro de <noscript/>.

Brian Kim
fonte
2

Eu uso http://wiltgen.net/objecty/ , ajuda a incorporar conteúdo de mídia e evita o problema do "clique para ativar" do IE.

Eduardo Campañó
fonte
O problema "clique para ativar" é chamado de "ativação do eolas", mas é removido nas versões reais do IE.
Anheledir
2

Como mencionado, o SWF Object é ótimo. OVNI vale a pena dar uma olhada também

phatduckk
fonte
2

Este vai funcionar, tenho certeza!

<embed src="application.swf" quality="high" pluginspage="http://www.macromedia.com/go/getfashplayer" type="application/x-shockwave-flash" width="690" height="430">
Stefan Đorđević
fonte
1

Qual é a melhor maneira? Palavras como 'mais eficiente', 'renderização mais rápida' etc. são mais específicas. De qualquer forma, estou oferecendo uma resposta alternativa que me ajuda na maior parte do tempo (se é ou não 'melhor' é irrelevante).

Resposta alternativa: use um iframe.

Ou seja, hospede o arquivo SWF no servidor. Se você colocar o arquivo SWF na pasta raiz ou public_html, o arquivo SWF estará localizado em www.YourDomain.com/YourFlashFile.swf.

Em seguida, no seu index.html ou em qualquer outro lugar, vincule o local acima ao seu iframe e ele será exibido em todo o seu conteúdo onde quer que você coloque o seu iframe. Se você pode colocar um iframe lá, pode colocar um arquivo SWF lá. Torne as dimensões do iframe iguais ao seu arquivo SWF. No exemplo abaixo, o arquivo SWF é de 500 por 500.

Pseudo-código:

<iframe src="//www.YourDomain.com/YourFlashFile.swf" width="500" height="500"></iframe>

A linha do código HTML acima incorporará seu arquivo SWF. Nenhuma outra bagunça é necessária. Prós: compatível com W3C, design de página amigável, sem problemas de velocidade, abordagem minimalista.
Contras: espaço em branco ao redor do arquivo SWF quando iniciado em um navegador.

Essa é uma resposta alternativa. Se é a melhor resposta, depende do seu projeto.

Syed
fonte
3
para google @Stoic desculpe seu erro deve-se //www...usar //meios que se o seu em HTTPS ou HTTP funciona usando o mesmo tipo de conexão
Barkermn01
1

Eu sei que esta é uma pergunta antiga. Mas essa resposta será boa para o presente.

<!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>
Isuru Dilshan
fonte
1

Thi funciona no IE, Edge, Firefox, Safari e 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>
xxnull
fonte
0

Isso funcionou para mim:

    <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>
gtb
fonte
0

Use o <embed>elemento:

<embed src="file.swf" width="854" height="480"></embed>
aaron34weston
fonte
-1

Você pode usar JavaScript se estiver familiarizado, assim:

swfobject.embedSWF("filename.swf", "Title", "width", "height", "9.0.0");

--o 9.0.0 é a versão flash.

Ou você pode usar a <object>tag HTML5.

Allan
fonte
-1 swfobject não é apenas parte do JavaScript, você não pode chamá-lo sem incorporar a biblioteca. e a maior parte da funcionalidade da tag <object> foi removida do HTML 4 para 5. Ele ainda pode ser usado, mas não recomendado. Em suma, uma resposta muito ruim.
Rorypicko
você já tentou antes de dizer que é uma resposta muito ruim? tenha em mente que uma resposta muito ruim é a resposta que não funciona totalmente ou está errada.
Allan
o fato de que você está informando alguém para uso javascript, e depois colar o código usando uma biblioteca JavaScript que você nem sequer torna uma resposta ruim mencionado
rorypicko
Eu já mencionei o Javascript usado e dei o script. Se eu desse todo o código / script de trabalho que faz uma alimentação com colher. O script é bom, é apenas uma lógica.
Allan
Você está entendendo mal o meu comentário. Você não disse a ele para incluir o arquivo SWFObject Javascript
rorypicko