Sto cercando di mantenere un video di sfondo centrato indipendentemente da quanto l'utente trascina il video. Al momento sto tagliando il lato destro dei video quando scorrono più piccoli. Ecco quello che ho:Sfondo video HTML5, mantenere il centro del video al centro
<section id="home">
<div class="video_shader"></div>
<div class="video_contain">
<video autoplay="" loop="" poster="img/still.jpg" id="bgvid">
<source src="/realWebm.webm" type="video/webm" />
<source src="/realdeal.mp4" type="video/mp4">
<source src="/reaOg.ogv" type="video/ogg" />
</video>
</div>
</section>
.video_contain{
display: block;
position: absolute;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
}
video {
min-width: 100%;
min-height: 100%;
z-index: -100;
background-position: center;
background-size: cover;
}
#home {
width: 100vw;
height: 100vh;
display:block;
position: relative;
}
vorrei che il centro del video per essere il centro della pagina sempre, anche se i lati vengono tagliati - che in realtà è l'ideale se avviene in questo modo. Gradirei qualsiasi aiuto. Grazie per aver letto!
Questa grande opera fino a quando ho colpito dimensioni mobili. Eventuali suggerimenti? Grazie! – ajmajmajma
Non dovrebbe comportarsi in modo diverso a dimensioni mobili. assicurati di non interferire con stili di query multimediali. Ho allegato una foto di come dovrebbe apparire a dimensioni mobili. – Todd