Explicação detalhada do uso de áudio médio HTML5 -TV

Formato de vídeo comum

• Componente do vídeo: tela, áudio, formato de codificação
• Codificação de vídeo: H.264, Theora, VP8 (Google Open Source)

HTML5 suporta formato de vídeo:

1. Ogg

Arquivo OGG com codificação de vídeo teora+codificação de áudio VORBIS

Navegador suportado: f, c, o

2. MEPG4

Arquivo mpeg4 com codificação de vídeo H.264+codificação de áudio AAC

Navegador suportado: S, C

3, WebM

Formato WebM com codificação de vídeo VP8+codificação de áudio VORBIS

Navegador suportado: i, f, c, o

Desvantagens: poucos vídeos, quase nenhum transcodificado, não é bom para a transcodificação

Se você deseja vídeo, você pode preencher automaticamente o tamanho do Pai Slow, basta adicionar estilo = largura = 100%à tag de vídeo;

Especifique um formato de vídeo.

 <ID do vídeo = mídia src = examp.mp4 width = 500 poster = examp1.jpg> Seu navegador não suporta vídeos </video>

Dado uma variedade de formatos de vídeo, que tipo de navegador escolhe jogar de acordo com seu próprio diploma

 <Video Controls = Controls> <fonte src = 1.mp4 type = video/mp4/> // Propriedades SRC Escreva em tags de origem, para especificar o tipo de tipo de vídeo, por exemplo, o mp4 é tipo = vídeo/mp4 <fonte <fonte Src = 2.gg type = video/ogg/> // formato ogg <origem src = 3.webm type = video/webm/> // formato webm </video>

Atributo da API

• Duração: retorne o comprimento do áudio/vídeo atual (em segundos)
• Parada em pausa: defina ou retorne áudio/vídeo se deve pausar
• CurrentTime: defina ou retorne a posição de reprodução atual em áudio/vídeo (em segundos)
• Terminou: se a reprodução do áudio/vídeo acabou

1.4.1 Método de vídeo

Método comum

• play (): comece a jogar áudio/vídeo
• pausa (): suspenda o áudio/vídeo atual

1.4.2 Status da rede

Obtenha um objeto de vídeo

 Mídia = document.getElementById (mídia);

1.media.currentsrc;

De volta ao URL do recurso atual

2.media.src = value;

Retornar ou definir o URL do recurso atual

3.media.CanplayType (tipo);

Você pode jogar um determinado recurso de formato

4.media.networkstate;

0. Este elemento não é inicializado

1. Normal, mas não usando a rede

2. Download de dados

3. Sem recurso

5.media.load ();

Re -carregar o recurso especificado por SRC

6.Media.Bufred;

Volte para a área de buffer, timerange

7.media.preload;

Nenhum: não é pré -carga

Metadados: Informações de Recursos de Pré -Carga

Auto:

1.4.3 Status da preparação

1.media.readyState

2.media.seking;

Se você está procurando

1.4.4 Status do jogo

1.media.CurrentTime = Value;

A posição atual de jogo pode ser alterada para a posição

2.Media.StartTime;

Geralmente 0, se for um mídia de fluxo ou o recurso que não começa a partir de 0, não é 0

3.media.Duration;

O comprimento do recurso atual de volta ilimitado

4.media.Paused;

Se deve fazer uma pausa

5.Media.DefaultPlayBackRate = Value;

A velocidade de reprodução padrão, você pode configurar

6.media.playbackrate = value;

A velocidade atual de reprodução é alterada imediatamente após a configuração

7.Media.Played;

Retorne à área que foi tocada, timerange, veja o objeto abaixo sobre este objeto

8.media.seekable;

Retornar à área que pode procurar

9.media.ndded;

Se deve terminar

10.Media.AutoPlay;

Se deve jogar automaticamente

11.media.loop;

Se deve circular

12.media.Play ();

Jogar

13.media.Pause ();

pausa

1.4.5 Controle de vídeo

• Media.Controls;
• Media.Volume = Value; // Volume
• Media.Muted = Value;
• Objeto timeranges (região)
• TimeRanges.Length;
• TimeRanges.start (índice) // A posição inicial da área de seção de índice
• TimeRanges.end (índice) // O final da área da seção de índice

1.4.6 Eventos relacionados

1. Primeiro de tudo, você pode vincular o evento através do método AddEventListener em JS

2. Eventos comuns

• ONCANPLAY: O script em execução quando o arquivo estiver pronto (o buffer é suficiente no início).
• OnTimeUpdate: Um script é executado quando a posição de reprodução muda (como quando o usuário está prestes a inserir uma posição diferente no meio).
• Oned: o script em execução quando a mídia chegar ao fim (pode enviar mensagens como graças à visualização).

1.4.7 Outros

1. Tela inteira:

• Element.WebkitRequestfulscreen ();
• Element.mozrequestfulscreen ();
• Element.RequestfulScreen ();

2. Saia da tela inteira:

• document.webkitcanceltscreen ();
• document.mozcanceltscreen ();
• document.exitfulscreen ();

1. Formato de áudio comum

Codificação de áudio: ACC, MP3, Vorbis

2. HTML5 suporta formato de áudio:

• OGG gratuitamente navegador: C, F, O
• Navegador de carregamento MP3: i, c, s
• Navegador de carregamento do WAV: F, O, S

Suporte para formato de música

O áudio pode ser criado por novo. Você também pode obtê -lo usando documens

 // 通过 novo 关键字来创建 áudio 对象 var music = novo áudio (test.mp3); // 通过 document 来获取已经存在的 áudio 对象 var music = document.getElementById (áudio); // 当然这里也可以使用 documento Obtenha outros métodos como .getElementsByClassName ('ClassName').

Primeiro de tudo, você pode vincular o evento através do método AddEventRistener em JS

De fato, a API e o áudio do vídeo são quase consistentes. Um pouco diferente. Então, basicamente, um dos outros estará lá

O acima é o conteúdo deste artigo.