29 juil. 2010

Créer une fenêtre pop up avec une vidéo

L'intérêt est de permettre au visiteurs de tourner les pages de votre blog, tout en ayant sous la main la vidéo. Placée dans une fenêtre pop up, elle reste toujours présente à l'écran.

Première étape :

Vous avez trouvé une vidéo chez Youtube ou daylimotion et vous avez obtenu un code object.

Prenons comme exemple, la vidéo de Zazie : J'étais là
<object width="425" height="355"><param name="movie" value="http://www.youtube.com/v/GX7Kg39E3Co&rel=1"></param><param name="wmode"
value="transparent"></param><embed src="http://www.youtube.com/v/GX7Kg39E3Co&rel=1" type="application/x-shockwave-flash" wmode="transparent" width="425"
height="355"></embed></object>
Deuxième étape :

Au lieu de coller ce code directement en HTML :
  • vous allez ouvrir votre Bloc note
  • le coller
  • enregistrer ce document sous Zazie.htm
Troisème étape :

Vous hébergez ce fichier Zazie.htm :
chez Archive-host par exemple

Vous obtenez une adresse : http://ddata.over-blog.com/xxxyyy/0/37/17/67/Musique/zazie.htm 

Quatrième étape :

Vous mettez ce fichier en lien en collant en html :
<a onclick="window.open(this, 'Zazie', 'width=425,height=355'); return false;" href="http://ddata.over-blog.com/xxxyyy/0/37/17/67/Musique/zazie.htm">Zazie - J'&eacute;tais l&agrave;</a>
En rouge : l'adresse de votre fichier

Ensuite, vous fixez les dimensions de cette fenêtre. En général, elles sont dans le code object : width="425" height="355"

Et vous obtenez :

Zazie - J'étais là

Ainsi, il suffit à vos lecteurs de cliquer sur le lien, une fenêtre avec votre vidéo s'ouvrira. S'il change de page sur le blog, la vidéo continuera à tourner.

Aucun commentaire:

Enregistrer un commentaire

1/ Choisissez Nom/URL comme profil pour poster, si vous hésitez
2/ Si vous désirez une aide personnalisée, pensez à laisser l'adresse de votre blog, ce qui me permettra de tester.
3/ Vous pouvez vous abonner par email pour suivre les réponses de cet article (lien sous la zone de rédaction du commentaire)