Buenas, estoy intentando hacer una web en la que se reproduzca un video a pantalla completa de fondo pero no se porque razon no me aparece el video, alguien me puede ayudar?
Lo estoy editando con el programa sublime text 2 (version gratuita) y lo ejecutado en chrome y explorer y nada.
El codigo del index.html es:
Código:
<!doctype html>
<html lang"es">
<head>
<meta charset="UTF-8">
<title>Es una plantilla</title>
<link rel="stylesheet" href="estilos.css">
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
</head>
<body>
<header>
<div id="logo">
Video fullscreen con HTML5
</div>
</header>
<video id="video1" loop autoplay preload poster="imagenes/poster.png">
<source scr="videos/video1.mp4" type="video/mp4"/>
<source scr="videos/video1.webm" type="video/webm"/>
<source scr="videos/video1.ogv" type="video/ogg"/>
</video>
</body>
</html>
y el codigo del estilos.css es:
Código:
body{
margin: 0;
padding: 0;
}
#video1{
position: fixed;
left: 0;
top: 0;
min-height: 100%;
min-width: 100%;
width: auto;
height: auto;
z-index: -10;
visibility: visible;
}
#logo{
width: 320px;
height: 320px;
margin: 40px auto;
background: url(imagenes/logo.png) no-repeat rgba(20, 118, 143,.5);
border-radius: 50%;
border: 15px solid rgba(255, 255, 255, .2);
padding: 13px;
text-indent: -99999px;
}
Muchas gracias.