Hello tout le monde, j'ai décidé de mettre une image video de 30sec en arriere plan de ma home-page.

Le problème est que rien ne se lit. Au lieu de voir ma vidéo je vois un fond blanc. Je pensais avoir tout bien fait mais la preuve que non..

J'ai telechargé la video en .mp4 en 1080p et j'utilise un navigateur mozilla récent. Merci de bien vouloir m'aider.

J'ai essayer de diminuer la qualité en allégant le poids mais rien ne marche.

<video id="video_background" preload="auto" autoplay="true" loop="loop" muted="muted" volume="0">
            <source src="C:/Users/julie/Videos/4K Video Downloader/Film pub Artisanat 30 s.mp4" type="video/mp4">
            <img src="background.jpg" width="100%" height="100%" > </video>

#video_background
{
position: absolute;
bottom: 0px;
right: 0px;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -1000;
overflow: hidden;
}

Je n'ai jamais fait ça mais un truc tout con les espaces dans le chemin ne serais pas un problème? 

..je ne suis vraiment pas sûr de ce que j'avance 

Hello,

Que dit la console web de ton navigateur, trouve t-il bien le fichier ?

C'est à dire ? Je ne comprend pas

Apparement on m'indique que j'ai besoin d'un lien .ogv et je ne sais pas comment le trouver

-
Edité par JulienFerrier1 23 février 2017 à 19:20:06

Outils de développement de ton navigateur, par exemple sous Chrome (Ctrl + Maj +  i) avec la page de ton sujet :

C'est très utile et même indispensable.

Après je n'ai jamais touché aux vidéos non plus...

Ok, ce serait alors sympa de poster la solutions pour ceux qui seraient intéressé.

<video autoplay loop class="video">
	    <source src="images\video.mp4" type="video/mp4">

.video
{
	position: absolute;
	top: -22.5%;
	left: 0%;
	z-index: -500%;
	min-width: 100%;
	min-height: 115%;
	width: 10%;
	height: 20%;
	transform: translate (-50%, -50%);
	overflow: hidden;
	
}

Faite bien attention a l'emplacement de votre video qui doit figurer dans votre dossier image.

Mon problème venait de là

Un site que j'ai découvert récemment qui te donne la solution clé en main.

Il faut aller sur le bouton démo du site et télécharger le Pack Bootstrap.

Ensuite tu changes la source vidéo pour mettre la tienne et ça fonctionne...

http://www.backgroundvideo.fr/

Salut,

Faîtes attention avec les vidéos, il peut y avoir des problèmes de compatibilité et il est plus prudent de proposer plusieurs format de la même vidéo

Pour plus d'explications :

https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3/la-video-et-l-audio#/id/r-1612260