Video en fond de page web (html5)

Soyez le premier à donner votre avis sur cette source.

Vue 19 876 fois - Téléchargée 1 991 fois

Description

Ce petit code permet d'afficher une vidéo dans une div en fond de page en utilisant la balise HTML5

</div>

<h1>Ceci est du contenu</h1>
<h2>Ceci est du contenu</h2>
<h3>Ceci est du contenu</h3>
<ul>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
<li>Element de liste</li>
</ul>
</body>
</html>
</code>

Conclusion :


On ne peut malheureusement pas modifier les proportions de la vidéo pour qu'elle s'adapte à la fenêtre.
L'attribut : "loop" ne fonctionne apparemment pas sur Gecko(FireFox), mais fonctionne sur WebKit(Safari, Chrome)

Codes Sources

A voir également

Ajouter un commentaire

Commentaires

teslacore
Messages postés
2
Date d'inscription
dimanche 1 juillet 2012
Statut
Membre
Dernière intervention
1 juillet 2012

Bon pour celles et ceux que ça intéressent au final ma solution a été de changer le .ogv en .ogg et ça passe sans pbm sur firefox
teslacore
Messages postés
2
Date d'inscription
dimanche 1 juillet 2012
Statut
Membre
Dernière intervention
1 juillet 2012

Bonsoir,

Ca passe bien sur Safari (selon les codecs et les formats évidemment) mais sur Firefox quel que soit le format, certains (webm ou ogv par ex) passent en test sur mon ordi, c'est en boucle et tout, parfait... mais ça ne marche jamais à partir du serveur... comment on dit ? distant ? Enfin une fois tout transféré sur l'hôte...

Une idée ?

Merci d'avance !
t0ny74
Messages postés
2
Date d'inscription
vendredi 22 juin 2012
Statut
Membre
Dernière intervention
22 juin 2012

Désolé, j'avais pas vu la réponse à ma question plus haut....
t0ny74
Messages postés
2
Date d'inscription
vendredi 22 juin 2012
Statut
Membre
Dernière intervention
22 juin 2012

Bonjour,

Je suis en stage avec un dj et je dois lui faire un site web avec une vidéo en fond de page comme ceci: http://quentinmosimann.com
Donc grâce au code du tuto, j'ai réussi, ça marche très bien sous firefox, malheureusement pas sur safari car ils ne supportent pas le même format.
J'ai donc fait les 3 même vidéos en format différent pour qu'elles soient supporté sur tous les navigateur.

Ma question: Comment mettre par code les 3 vidéos en gardant ce code ci?

J'ai essayer de rajouter ce code:

<video>
<source src="video.mp4" type="video/mp4" />
<source src="video.webm" type="video/webm" />
<source src="video.ogv" type="video/ogg" />
</video>

et il marche mais le problème c'est que du coup la vidéo n'est plus en fond de page, en plein écran mais elle se met dans un petit player...

Merci d'avance pour vos réponses!
owno21
Messages postés
1
Date d'inscription
vendredi 27 avril 2012
Statut
Membre
Dernière intervention
3 mai 2012

Salut,

Tous d'abord bien merci pour se partages j'aurais aimez s'avoir si quelqu'un pouvais m'aider sur cette fameuse intégration de video dans le fond
de notre pages HTML 5 (Pour vous dire je suis un jeune Architect designer qui aimerais faire sont site je touche as plusieurs programme d'adobe ( AE-expert,Php-expert,Dreamweaver-debutant,flash-débutant) ausii j'utilise pas mal cinema 4D et autre programme 3D et 2D je gere aussi les composition musical avec logic fin soite enfaite se qu'il me manque c de pouvoir créer mon site pour exposer et vendre mes oeuvres
donc si quelqu'un as un peu de temps a me consacrer j'aimerais s'avoir plusieurs chose :

1) Si je souhaite Avoir une Pages Dynamique
exemple : Un fond avec video et sur cette video j'aimerais placer des boutton Dynamique aussi ainssi que différent formulaire (inscriptions,contact ...)

En gros je parles de Creer un site web Video Donc la video se serai le fond du site avec d'autre interaction du style changer de video lors d'un changement de page
sans coupure et en fondue

Cela est-il possible ? Si Oui , Comment puis-je le réaliser ( j'attend pas un tutoriel entier sur sa mes le langages à utiliser,différent technique qui pourrons m'aider...)
Pour revenir à mes mouton j'ai essaye d'intégrer ma video en .flv dans votre code mes cela ne fonctionne pas si quelqu'un peux m'aider aux niveaux de l'insertion de sa video dans le code se serais gentil :)
A oui si une personne qui si connais dans le domaine peux m'aider je serais prés à lui envoyer un petit dont via paypal merci
Merci et à bientôt

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.