estou com um problema na minha tag vídeo pois queria deixa-lá com um width:100%
e o height:100%;
porem sem perder a minha qualidade do vídeo ele teria que ficar parecido com o desse site aqui abri alguns tópicos referente a esse assunto que foi resolvido em partes pois consegui deixa-lo com a largura e a altura 100% porem o vídeo esticava e perdia sua qualidade atualmente meu vídeo esta como eu quero porem os valores eu ajusto manualmente e como estou começando a usar media queries estou com muitas dificuldades para poder adaptar isso em diferentes resoluções segue o código do meu vídeo:
#video {
width: 100%;
height: 100%;
}
video {
height: 100%;
width: 100%;
z-index: -100;
position: absolute;
top: 0;
left: 0;
-webkit-transform: scaley(1.72);
-o-transform: scaley(1.72);
-ms-transform: scaley(1.72);
-moz-transform: scaley(1.72);
transform: scaley(1.72);
}
<div id="video">
<video id="Video1" width="100%" height="100%" loop>
<source src="video/League-warrios.mp4" type="video/mp4" />
</video>
</div>
Como podem ver aqui nesse trecho de código ele esta 100% de altura e de largura porem ele só esta com a altura porque fui ajustando no CSS na tag transform:scale(1.72);
porem esse método e errado ele teria que se ajustar automaticamente pois se colocar em uma tela muito pequena logo não vai se ajustar corretamente
essa e a print da forma que esta funcionando porem não e a forma correta de se fazer :