Tenho um vídeo HD (1920x818 aproximadamente) em meu site, tive ajuda em uma parte da solução já que foi colocar 100%x100%
.
Agora gostaria de deixar ele fixo no topo da página, tentei usar position:absolute; top:0; left:0;
, funciona mas aparecem duas barras pretas (em cima e em baixo). Como resolvo isso?
Gostaria de um resultado parecido com o desse site: http://www.popupdesign.com.br/
Reparem que abaixo da imagem/vídeo no topo existe um menu, gostaria de adaptar essa situação ao meu caso.
O que tenho até agora:
<div id="video">
<video width="100%" height="100%" loop>
<source src="video/animacao-lol.mp4" type="video/mp4" />
</video>
</div>
#video {
width: 100%;
height: 100%;
}
video {
height: 99%;
width: 100%;
z-index: -100;
background-color: #000;
}