HTML - Incorporar multimídia

Às vezes, você precisa adicionar música ou vídeo em sua página da web. A maneira mais fácil de adicionar vídeo ou som ao seu site é incluir a tag HTML especial chamada<embed>. Esta tag faz com que o próprio navegador inclua controles para a multimídia fornecida automaticamente pelo navegador que suporta a tag <embed> e o tipo de mídia fornecido.

Você também pode incluir um <noembed>tag para os navegadores que não reconhecem a tag <embed>. Você pode, por exemplo, usar <embed> para exibir um filme de sua escolha, e<noembed> para exibir uma única imagem JPG se o navegador não suportar a tag <embed>.

Exemplo

Aqui está um exemplo simples para reproduzir um arquivo midi incorporado -

<!DOCTYPE html>
<html>

   <head>
      <title>HTML embed Tag</title>
   </head>
	
   <body>
      <embed src = "/html/yourfile.mid" width = "100%" height = "60" >
         <noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
      </embed>
   </body>

</html>

Os atributos da tag <embed>

A seguir está a lista de atributos importantes que podem ser usados ​​com a tag <embed>.

Note−Os atributos align e autostart tornaram-se obsoletos no HTML5. Não use esses atributos.

Sr. Não Atributo e descrição
1

align

Determina como alinhar o objeto. Pode ser definido para centro, esquerda ou direita .

2

autostart

Este atributo booleano indica se a mídia deve iniciar automaticamente. Você pode defini-lo como verdadeiro ou falso.

3

loop

Especifica se o som deve ser reproduzido continuamente (definir o loop para verdadeiro), um certo número de vezes (um valor positivo) ou não (falso)

4

playcount

Especifica o número de vezes para reproduzir o som. Esta é uma opção alternativa para o loop se você estiver usando o IE.

5

hidden

Especifica se o objeto multimídia deve ser mostrado na página. Um valor falso significa não e valores verdadeiros significam sim.

6

width

Largura do objeto em pixels

7

height

Altura do objeto em pixels

8

name

Um nome usado para fazer referência ao objeto.

9

src

URL do objeto a ser incorporado.

10

volume

Controla o volume do som. Pode ser de 0 (desligado) a 100 (volume total).

Tipos de vídeo suportados

Você pode usar vários tipos de mídia como filmes Flash (.swf), AVI's (.avi) e tipos de arquivo MOVs (.mov) dentro da tag embed.

  • .swf files - são os tipos de arquivo criados pelo programa Flash da Macromedia.

  • .wmv files - são os tipos de arquivo de vídeo de mídia do Windows da Microsoft.

  • .mov files - são o formato Quick Time Movie da Apple.

  • .mpeg files - são arquivos de filme criados pelo Moving Pictures Expert Group.

<!DOCTYPE html>
<html>

   <head>
      <title>HTML embed Tag</title>
   </head>

   <body>
      <embed src = "/html/yourfile.swf" width = "200" height = "200" >
         <noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
      </embed>
   </body>

</html>

Isso produzirá o seguinte resultado -

Áudio de fundo

Você pode usar HTML <bgsound>tag para reproduzir uma trilha sonora no plano de fundo de sua página da web. Esta tag é compatível apenas com o Internet Explorer e a maioria dos outros navegadores a ignora. Ele baixa e reproduz um arquivo de áudio quando o documento host é baixado pela primeira vez pelo usuário e exibido. O arquivo de som de fundo também será reproduzido sempre que o usuário atualizar o navegador.

Note- A tag bgsound está obsoleta e deve ser removida em uma versão futura do HTML. Portanto, eles não devem ser usados, é sugerido o uso de tag de áudio HTML5 para adicionar som. Mas ainda para fins de aprendizado, este capítulo irá explicar a tag bgsound em detalhes.

Esta tag tem apenas dois atributos loop e src . Ambos os atributos têm o mesmo significado explicado acima.

Aqui está um exemplo simples para reproduzir um pequeno arquivo midi -

<!DOCTYPE html>
<html>

   <head>
      <title>HTML embed Tag</title>
   </head>
	
   <body>
      <bgsound src = "/html/yourfile.mid">
         <noembed><img src = "yourimage.gif" ></noembed>
      </bgsound>
   </body>
	
</html>

Isso produzirá a tela em branco. Esta tag não exibe nenhum componente e permanece oculta.

O Internet Explorer também pode lidar com apenas três arquivos de formato de som diferentes - wav, o formato nativo para PCs; au, o formato nativo para a maioria das estações de trabalho Unix; e MIDI, um esquema universal de codificação de música.

Tag de objeto HTML

HTML 4 apresenta o <object>elemento, que oferece uma solução multifuncional para inclusão de objeto genérico. o<object> O elemento permite que os autores de HTML especifiquem tudo o que é exigido por um objeto para sua apresentação por um agente do usuário.

Aqui estão alguns exemplos -

Exemplo 1

Você pode incorporar um documento HTML em um documento HTML da seguinte maneira -

<object data = "data/test.htm" type = "text/html" width = "300" height = "200">
   alt : <a href = "data/test.htm">test.htm</a>
</object>

Aqui, o atributo alt entrará em cena se o navegador não suportar tag de objeto .

Exemplo - 2

Você pode incorporar um documento PDF em um documento HTML da seguinte maneira -

<object data = "data/test.pdf" type = "application/pdf" width = "300" height = "200">
   alt : <a href = "data/test.pdf">test.htm</a>
</object>

Exemplo - 3

Você pode especificar alguns parâmetros relacionados ao documento com o <param>tag. Aqui está um exemplo para incorporar um arquivo wav -

<object data = "data/test.wav" type = "audio/x-wav" width = "200" height = "20">
   <param name = "src" value = "data/test.wav">
   <param name = "autoplay" value = "false">
   <param name = "autoStart" value = "0">
   alt : <a href = "data/test.wav">test.wav</a>
</object>

Exemplo - 4

Você pode adicionar um documento Flash da seguinte forma -

<object classid = "clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id = "penguin" 
   codebase = "someplace/swflash.cab" width = "200" height = "300">
   
   <param name = "movie" value = "flash/penguin.swf" />
   <param name = "quality" value = "high" />
   <img src = "penguin.jpg" width = "200" height = "300" alt = "Penguin" />
</object>

Exemplo - 5

Você pode adicionar um miniaplicativo Java ao documento HTML da seguinte maneira -

<object classid = "clsid:8ad9c840-044e-11d1-b3e9-00805f499d93" 
   width = "200" height = "200">
   <param name = "code" value = "applet.class">
</object>

o classidatributo identifica qual versão do Java Plug-in usar. Você pode usar o atributo codebase opcional para especificar se e como fazer o download do JRE.