Integrer une vidéo dans un site web

dr-lu74 Messages postés 28 Date d'inscription   Statut Membre Dernière intervention   -  
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

Je recherche un moyen pour lorsqu'on accède à une page web (Genre page d'accueil) on ai une vidéo qui se lit automatique (Jusque là pour integrer une vidéo avec lecture auto ça va) mais une fenêtre au dessus de la page d'accueil qui lit une vidéo après, on ai accès au site.

Merci d'avance
dr-lu74
A voir également:

1 réponse

Réponse 1 / 1
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   738
 
Salut

je t'explique le principe tu peux faire ca avec html / css plus un petit brin de jquery
tu crée 1 div qui prend tout le site et placée au dessus de tous les div avec z-index et avec une opacity
tu crée une autre avec la video que tu centre avec css et placée au dessus de la précédente avec z-index et positionnée en absolute

et avec jquery tu detecte la fin de la video et tu cache les 2 div précédentes

ca donnerait ca (non testé)

dans le head 

<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script>
 $(function () {
	$("#mavideo").bind("ended", function() {
	   $("#coverall").hide(300);
           $("#cadrevideo").hide(300);
	});
});
</script>

ensuite tu fait ca en html juste après <body> 

<div id="coverall"></div>
<div id="cadrevideo">
<video id="mavideo"> ...le code d'appel de ta vidéo ...</video>
</div>

le css 

#coverall {
    position:fixed;
    display:none;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color: #999999;
    z-index:900; /* pour être pardessus tous les autres div */
    opacity:0.5;
    filter: alpha(opacity=50);  
}

#cadrevideo {
    width:500px;
    height:300px;
    position:absolute;
    left:50%; 
    top:50%; 
    margin:-150px 0 0 -250px; /* la moitié des width */
    z-index:1000; 
}
0

Discussions similaires

C'est quoi le site qui remplace coco chat
TP3 -
bazfile -

2 réponses