Respostas interessantes marcadas com a tag

15 votos
Aceito

Como é criado aqueles vídeos de pré-visualização da thumbnail nos players?

Primeiramente, O Google deve ter uma API que pega alguns frames do vídeo e gera um .WEBP, esse é um formato que assim como o .GIF tb aceita animações. Veja que em um sistema do tamanho do Youtube ...
  • 66,6mil
12 votos

Como criar um novo arquivo .M3U corretamente? (Sendo que ja tenho o streaming .TS)

TL;DR Use o FFmpeg. Para recriar o m3u8 a partir de apenas um arquivo .ts: ffmpeg -i arquivo_original.ts -codec copy -hls_flags single_file -hls_list_size 0 nova_playlist.m3u8 O comando para ...
  • 3.208
6 votos

Como aciono um evento js quando um vídeo html atingir um dado segundo?

Use o evento timeupdate (que é suportado tanto por ambos <video> e <audio>) junto com a propriedade HTMLMediaElement.currentTime (retorna o valor em segundos) Nota: Veja mais eventos e ...
5 votos

Como rodar arquivos .mkv em todos navegadores?

O HTML não suporta nenhum formato de vídeo, e o HTML5 não especifica quais formatos os navegadores devem suportar. Cabe então aos navegadores decidir quais formatos eles escolhem suportar. ...
4 votos
Aceito

Tratar 404 no video html5

Se for para verificar se um vídeo existe ou não, talvez seja melhor verificar isso antes de carregar a tag video. Se o vídeo existir você monta a tag, caso contrário monta uma mensagem de erro no HTML ...
4 votos
Aceito

Gravar arquivo de vídeo após captura no site

Vou postar apenas a parte do envio do JavaScript, como você vai receber no PHP e vai processar a Stream, isto irei deixar ao seu criterio. Para o exemplo abaixo, irei utilizar um input:file, nele ...
  • 23,1mil
4 votos
Aceito

Problema com reprodução de vídeos usando tag nativa do HTML5

Tente converter o video para mp4 mas desta vez usando o codec H.264 Video H.264 Audio AAC HTML5 Video Encoding
  • 3.235
4 votos

Inserir Vídeo em HTML

Provavelmente você esta subindo o video via FTP e talvez esteja assumindo o upload como ASCII, para que não perca dados faça o upload como binário, por exemplo no Filezilla vá em: Transfer > Transfer ...
4 votos
Aceito

Otimizar vídeo em HTML 5

Seguem minhas dicas. Primeiro adicione um poster poster="1frame-do-video.jpg" na sua tag de <video> e coloque o atributo preload="auto". Assim enquanto o vídeo não carrega fica a imagem de ...
  • 66,6mil
4 votos

Como colocar um Vídeo dentro de um Texto com CSS? É possível colocar um Vídeo como background de texto?

Como não obtive resposta vou postar um resultado que consegui usando mix-blend-mode https://developer.mozilla.org/pt-BR/docs/Web/CSS/mix-blend-mode A propriedade mix-blend-mode descreve como um ...
  • 66,6mil
4 votos
Aceito

Controls de tag video não estão funcionando

O erro está na escrita de "scr", o certo seria "src".
3 votos

Otimizar vídeo em HTML 5

O tamanho do vídeo não deveria ser problema. O formato do vídeo sim. Encontrei este artigo que discorre sobre isso. O mais importante é o seguinte: Here’s where this whole “mp4 streaming”, which ...
3 votos
Aceito

Como remover opção de download de vídeo

Achei uma solução: https://jsfiddle.net/u1wqb4kz/ // Remove botão de download de vídeos video::-internal-media-controls-download-button { display:none; } video::-webkit-media-controls-...
  • 1.926
3 votos
Aceito

Mudar cursor no evento "onhover" para HTML5 <video>

Dei uma pesquisada e vi que existem esses pseudo-elementos que talvez você possa usar: video::-webkit-media-controls-play-button video::-webkit-media-controls-volume-slider-container video::-...
  • 5.905
3 votos
Aceito

Desabilitar botão de download HTML5 Video

Escondendo o botão com um Blob Ao fazer um blob do vídeo e depois um parse para URL (usando URL.createObjectURL), o Google Chrome automaticamente esconde o botão: var video = document.querySelector('...
  • 10,1mil
3 votos

Como fazer um vídeo iniciar e reiniciar automaticamente?

Solução nada bonita mas eficaz: document.getElementById('vid').play(); <video controls src="https://ia800701.us.archive.org/26/items/SampleVideo1280x7205mb/SampleVideo_1280x720_5mb.mp4" type="...
2 votos
Aceito

Erro desconhecido causado pela biblioteca do videojs

Resolvi o problema, mudando a regra do "autoplay", pois no chrome não estava executando o "autoplay", sem antes completar carregamento no Dom do vídeo: $(function() { var myPlayer = videojs("...
  • 12,2mil
2 votos

Otimizar vídeo em HTML 5

Você pode colocar o seu vídeo para carregar após a página e todo o seu conteúdo forem carregados. Exemplo: <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/...
2 votos

Como os sites de compartilhamento de vídeos realizam o autoplay com áudio no chrome

O próprio HTML5 tem um atributo na tag vídeo de autoplay <video controls autoplay> <source src="https://www.w3schools.com/TAgs/movie.mp4" type="video/mp4"> <source src="https:...
2 votos

Como rodar arquivos .mkv em todos navegadores?

A extensão .mkv e .mp4 não tem nada haver com o formato do video, você poderia renomear um arquivo com o formato mp4 para a extensão video.foobaz que ainda seria um arquivo .mp4. Videos não são ...
2 votos

Exibir um vídeo diferente para cada visitante

Claro, é pra isso que servem os "Cookies": https://developer.mozilla.org/pt-BR/docs/Web/HTTP/Cookies Pequei parte do código em https://www.w3schools.com/js/js_cookies.asp Você só precisa criar um ...
  • 324
2 votos

Legendas não aparecem em HTML5 video tag

Existem alguns pontos a serem corrigidos no seu arquivode legendas... O separador decimal para os millesegundos deve ser o . e não a ,. É recomendado que você inicie a primeira linha do seu .vtt com a ...
1 voto
Aceito

WEBCAM sem Flash

Seu único erro é estar chamando a função na hora de declarar: window.addEventListener("DOMContentLoaded", startCamera()) O correto é o próprio DOMContentLoaded chamar, ficando assim: window....
1 voto
Aceito

Vídeo como Background HTML 5 não funciona no Safari e Chrome no Mac

Thayna eu não tenho um Mac aqui para testar, mas a sua tag do video pode ser construída com o source dentro da tag video, o que é mais adequado. Pode ser que assim funcione no Mac..., mas como falei ...
  • 66,6mil
1 voto

Copiar <video> com seus respetivos atributos

A cópia do elemento HTML está correta, mas infelizmente você não vai conseguir reproduzir o stream em formato MPEG-DASH diretamente pela tag video do HTML5. No caso, o dash.js é que está fazendo ...
1 voto

Como colocar um vídeo para abrir em fullscreen automaticamente em uma página HTML?

O HTML 5 não fornece nenhuma maneira de fazer um vídeo em tela cheia, mas a especificação em Fullscreen paralela fornece o método requestFullScreen que permite que elementos arbitrários (incluindo ...
  • 3.326
1 voto

Como colocar um vídeo para abrir em fullscreen automaticamente em uma página HTML?

Você pode alterar o style do vídeo: <video id=video autobuffer autoplay="true"> <source src="media_v/video.mp4"> <object type="video/mp4" data="media_v/video.mp4" min-width: 100% ...
1 voto
Aceito

Tag video dentro do Slick

Encontrei uma resposta no SOen que provavelmente soluciona o teu problema, adaptei um pouco a resposta p/ se adequar melhor ao teu contexto. Sabendo que a url do vídeo está correta, você irá precisar ...
  • 5.905
1 voto
Aceito

Problemas com a legenda de vídeos em HTML5

Não existe muito segredo no HTML5, mas a maior parte dos problemas ocorre porque: O navegador/player do usuário simplesmente não oferece o suporte à legendas, ainda que ofereça suporte à vídeo. O ...

Only top scored, non community-wiki answers of a minimum length are eligible