No parte anterior Neste tutorial, usando uma mistura de HTML5, jQuery e CSS, construímos a funcionalidade barebones do plano de fundo de vídeo em tela cheia orientado por HTML5. Desta vez, vamos modelá-lo, preparando substitutos para ele e entendendo como ele pode ser usado como parte de seus próprios projetos de trabalho. No guia de hoje, adicionaremos nosso vídeo em tela cheia de várias maneiras, incluindo:

  • criando nossas próprias sobreposições de padrões para se posicionar no topo do nosso vídeo; como linhas de scan de estilo antigo, estilizando seu vídeo para se adequar ao seu próprio design;
  • convertendo nosso vídeo em vários formatos para habilitar o suporte universal entre navegadores para o plano de fundo de seu vídeo.

Junto com tudo isso, também mostrarei um exemplo de como o vídeo pode ser usado de forma criativa, colocando outros elementos em camadas sobre ele, mostrando como essa técnica poderosa pode alimentar seus novos designs; ou até mesmo fornecer um plano de fundo novo e excitante para o design em que você está trabalhando atualmente!

Você usou o vídeo em tela cheia como plano de fundo em um de seus projetos? Você tem um método preferido de implementação? Deixe-nos saber nos comentários.