Inserrer UNE Video dans une page HTML.

tom@ Messages postés 201 Date d'inscription   Statut Membre Dernière intervention   -  
 guy -
Salut,
afin d' aider ceux qui veullent diffuser de la video ou du son sur le Net,
j' ai rassemblé quelques infos relatives au Streaming (Flux).

Exemple de streaming ici à ce lien :
http://starwars.com/ (laisser la page s' afficher, cliquer sur TRAILERS(Menu) puis sur un des liens pour voir une bande annonce de l' episode III)

Dans votre page HTML , il faut utiliser deux sortes de Balises HTML:
OBJECT et EMBED.
Trois technologies pourront etre utilisées pour afficher de l' audio ou de la video: Real Player , Quick Time et Windows Media Player. Chacun a son propre code HTML.

Pour REAL, le code standard à inserrer dans la page entre <BODY></BODY> est par exemple:

<OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" WIDTH="160" HEIGHT="16"
CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">

<PARAM name="SRC" VALUE="le chemin complet du fichier">
<PARAM name="AUTOPLAY" VALUE="false">
<PARAM name="LOOP" VALUE="false">
<PARAM name="CONTROLLER" VALUE="true">

<EMBED type="audio/x-mpegurl" src="le chemin complet du fichier" autoplay="false" width="160px"

height="16px" loop="false" controller="true" PLUGINSPAGE="http://www.apple.com/quicktime/download/">
</EMBED>

</OBJECT>


La balise OBJECT inclut une balise EMBED pour assurer la compatibilité entre navigateurs.
On definit donc deux fois les paramètres du lecteur. Les paramètres sont passés à la balise OBJECT via des balises .
(OBJECT est reconnu par IE )

<PARAM name="" value=""> et à la balise EMBED par des paires nom="valeur"

LES PARAMETRES de EMBED pour Real:
---------------!-----------------------------------------
src ! URL
---------------!-----------------------------------------
AUTOPLAY ! true ou false
---------------!-----------------------------------------
CONTROLLER! true(panneau de controle) ou false
---------------!-----------------------------------------
TYPE ! (dans Embed) Type mine du fichier à lire
! mp3 => audio/mpeg
! m3u => audio/x-mpegurl
! au => audio/basic
! aiff=> audio/aiff
---------------!-----------------------------------------
Ce ne sont pas les seuls attributs possibles!

Pour Windows Media Player:

<OBJECT width=175 height=30 classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"

codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,0,02,902"
standby="Chargement de Microsoft Windows Media Player..." type="application/x-oleobject">

<PARAM NAME="FileName" VALUE="le chemin complet du fichier">
<PARAM NAME="animationatStart" VALUE="true">
<PARAM NAME="transparentatStart" VALUE="true">
<PARAM NAME="autoStart" VALUE="false">
<PARAM NAME="showControls" VALUE="true">
<PARAM NAME="autoSize" VALUE="0">

<EMBED type="application/x-mplayer2" pluginspage = "http://www.microsoft.com/Windows/MediaPlayer/"
SRC="le chemin complet du fichier" width="175" height="30" AutoStart="false"

autosize="0" transparentatStart="true" animationatStart="true" showControls="true">
</EMBED>

</object>


Pour ajouter une image en fond d'un player "embed" sur une page Web, créez une cellule de tableau autour de votre player.
Pour cela, utilisez une feuille de style externe (CSS) ou un style directement dans la balise <td>, comme ceci :

<td style="background: url(fondv1.png) no-repeat;">

NB: Le paramètre "TransparentAtStart" doit être à 1 pour Windows Media.

Pour QuickTime :

<OBJECT CLASSID="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" WIDTH="175" HEIGHT="30">

<PARAM NAME="CONTROLS" VALUE="ControlPanel">
<PARAM NAME="CONSOLE" VALUE="Clip1">
<PARAM NAME="AUTOSTART" VALUE="false">
<PARAM NAME="nologo" VALUE="true">
<PARAM NAME="NOJAVA" VALUE="true">
<PARAM NAME="SRC" VALUE="http://le chemin complet du fichier">
<PARAM NAME="LOOP" VALUE="false">

<EMBED SRC="le chemin complet du fichier3" WIDTH="175" HEIGHT="30"
TYPE="audio/x-pn-realaudio-plugin"
NOLOGO="true" NOJAVA="true" CONTROLS="ControlPanel" CONSOLE="Clip1"
AUTOSTART="false" LOOP="false"></EMBED>

</OBJECT>


Les attributs d' embed pour REAL: voir par exemple http://www.media-box.net/tuts.php?iddr=294

Quelques sites pour en savoir plus sur le streaming :

http://www.streaming-solutions.com/faq-streaming/
http://www.netcast.be/
http://www.video-en-ligne.com/
http://data.over-blog.com
http://www.repaire.net/navig/diff_internet/index.php
http://users.skynet.be/xyzebres/multimedialab/cours/streaming.htm

Voilà en gros !!))

Tom

12 réponses

tom@ Messages postés 201 Date d'inscription   Statut Membre Dernière intervention   50
 
Je me suis rendu compte que le code pour REAL est en fait celui de Quick Time.Et inversement.

Je les réécris pour corriger mon erreur :

Pour REAL c'est donc :
<OBJECT CLASSID="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" WIDTH="175" HEIGHT="30">

<PARAM NAME="CONTROLS" VALUE="ControlPanel">
<PARAM NAME="CONSOLE" VALUE="Clip1">
<PARAM NAME="AUTOSTART" VALUE="false">
<PARAM NAME="nologo" VALUE="true">
<PARAM NAME="NOJAVA" VALUE="true">
<PARAM NAME="SRC" VALUE="http://le chemin complet du fichier">
<PARAM NAME="LOOP" VALUE="false">

<EMBED SRC="le chemin complet du fichier3" WIDTH="175" HEIGHT="30"
TYPE="audio/x-pn-realaudio-plugin"
NOLOGO="true" NOJAVA="true" CONTROLS="ControlPanel" CONSOLE="Clip1"
AUTOSTART="false" LOOP="false"></EMBED>

</OBJECT>


Et pour Quick Time :
<OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" WIDTH="160" HEIGHT="16"
CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">

<PARAM name="SRC" VALUE="le chemin complet du fichier">
<PARAM name="AUTOPLAY" VALUE="false">
<PARAM name="LOOP" VALUE="false">
<PARAM name="CONTROLLER" VALUE="true">

<EMBED type="audio/x-mpegurl" src="le chemin complet du fichier" autoplay="false" width="160px"

height="16px" loop="false" controller="true" PLUGINSPAGE="http://www.apple.com/quicktime/download/">
</EMBED>

</OBJECT>


tom
12
laetysya Messages postés 1 Date d'inscription   Statut Membre Dernière intervention  
 
Bonjour j'aimerais savoir comment obtenir une lecteur qui puisse accepter plsieurs chant en même temps je suis novice en code HTML , voici ce que j'ai


<object CLASSID="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" WIDTH="175" HEIGHT="30">
<param NAME="CONTROLS" value="ControlPanel">
<param NAME="CONSOLE" value="Clip1">
<param NAME="AUTOSTART" value="0">
<param NAME="SRC" ref value="http://users.skynet.be/ra044965/lefleuvededieu.mp3">
<param NAME="LOOP" value="0">
<param name="_ExtentX" value="4630">
<param name="_ExtentY" value="794">
<param name="SHUFFLE" value="0">
<param name="PREFETCH" value="0">
<param name="NOLABELS" value="0">
<param name="NUMLOOP" value="0">
<param name="CENTER" value="0">
<param name="MAINTAINASPECT" value="0">
<param name="BACKGROUNDCOLOR" value="#000000">
<EMBED SRC="le chemin complet du fichier3" WIDTH="175" HEIGHT="30"
TYPE="audio/x-pn-realaudio-plugin"
NOLOGO="true" NOJAVA="true" CONTROLS="ControlPanel" CONSOLE="Clip1"
AUTOSTART="false" LOOP="false"></EMBED></object>
0
gigi12
 
SOUS SILVERLIGHT , il parait qu'il faut creer un fichier .xap qu'il faut mettre sur le serveur ..
Peut on avoir un exemple concret , surtout que sous silverlight , c'est multi plateforme.....
Merci de votre aide????
0
dab653
 
Petite question:
Pourquoi les noms de balises sont-ils en MAJUSCULE ?
0
guy
 
allez à : http://www.movavi.com/videoconverter/?gclid=COzEgvuH5bECFcMXzQodLR4AQg et télécharger sa
0
istary Messages postés 243 Date d'inscription   Statut Membre Dernière intervention   6
 
bonjour, j'ai utilisé le code suivant :

<OBJECT width=175 height=30 classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"

codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab"
standby="Chargement de Microsoft Windows Media Player..." type="application/x-oleobject">

<PARAM NAME="FileName" VALUE="le chemin complet du fichier">
<PARAM NAME="animationatStart" VALUE="true">
<PARAM NAME="transparentatStart" VALUE="true">
<PARAM NAME="autoStart" VALUE="false">
<PARAM NAME="showControls" VALUE="true">
<PARAM NAME="autoSize" VALUE="0">

<EMBED type="application/x-mplayer2" pluginspage = "https://support.microsoft.com/en-us/windows/get-windows-media-player-81718e0d-cfce-25b1-aee3-94596b658287"
SRC="le chemin complet du fichier" width="175" height="30" AutoStart="false"

autosize="0" transparentatStart="true" animationatStart="true" showControls="true">
</EMBED>

</object>


Ma video ne s'affiche pas :s
Pourquoi ?

Merci d'avance
4
peterpan833 Messages postés 44 Date d'inscription   Statut Membre Dernière intervention   16
 
Bonjour

Avec IE7 ça marche très bien avec l'image en fond

Je viens de passer à Firefox et la fenêtre du Windows Media player avec l'image en fond ne s'affiche plus

Pourtant ça marche, mais invisible, j'ai pourtant bien activer le code visibilté sur "true" comme pour IE7

Quelqu'un a pu régler ce problème ,

Merci

Bien cordialement
2
peterpan833 Messages postés 44 Date d'inscription   Statut Membre Dernière intervention   16
 
Hello

J'ai eu la réponse avec Firefox ça ne marche pas à cause de :
<PARAM NAME="transparentatStart" VALUE="true">

valable uniquement pour IE
2

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
canalplus
 
comment faire un site dans lequel je pourrais en tant qu'admin, heberger a partir de mon ordinateur une vidéo?
2
thundering
 
Bonjour
Apres avoir ete regarder les discussions en ce qui concerne l'integration de video sur une page web, vos conseils ont ete extremement judicieux et je vous en remercie. En plus de ce que vous proposez en ce qui concerne l'integration d'une video dans une page web, j'aimerai pouvoir realiser la chose suivante : J'ai plusieurs images en dessous d’un lecteur windows media qui sera le seul player de la page. Quand on clique sur l'image 1, j'aimerai que la video ( video1.wmv je precise le nom pour le code) se charge dans le lecteur windows media sans recharger la page. Quand on clique sur l'image 2, j'aimerai que la video (video2.wmv) se charge dans le lecteur windows media sans recharger la page et ainsi de suite. Et avant tout ça, j’aimerai qu’une video se charge automatiquement quand les gens arrivent sur la page d’index avec une compatibilite Internet Explorer et Firefox en ne voyant pas la fonctions Show status bar ( pas d'affichage pourcentage buffer ) mais je veux voir les commandes avance rapide--marche---arret--pause---mute---Pouvez vous me donner la demarche a suivre et le script adapte s'il vous plait? Je pense que le javascript va etre de rigueur pour certaines fonctions en particulier pour lire plusieurs videos avec un seul player. Je voudrais realiser ceci dans une page html car c'est le langage que j'utilise le plus.....Enfin j'ai essaye plusieurs clsid:
22D6F312-B0F6-11D0-94AB-0080C74C7E95
6BF52A52-394A-11d3-B153-00C04F79FAA6
etc....Soit les videos n'etaient pas redirigees correctement (dans le lecteur unique windows media player) soit elles ne marchaient pas, soit certaines fonctions active x n'etaient pas prises en compte....soit rien ne marchait !!! plus d'une semaine a galerer
Merci de votre reponse et surtout de votre aide
Cordialement
2
rixan Messages postés 414 Date d'inscription   Statut Membre Dernière intervention   43
 
Merci beaucoup l'ami pour ces explications

Vive la balise <OBJECT>
2
chanti
 
Bonjour,
Je cherche à intégrer un quicktime VR à une page html et je rencontre deux problèmes :
- la barre de controller s'affiche bien en dessous mais elle ne comporte aucun bouton. Ils ne sont pas caché car meme si l'on clique là ou ils devraient se trouver, rien ne se passe.
- ma vidéo s'affiche à la taille voulue dans Safari uniquement. Dans Firefox et IE, la vidéo est coupé à son tiers supérieur.

mon code est :
<OBJECT classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="600" height="630" CODEBASE ="http://www.apple.com/qtactivex/qtplugin.cab">
<PARAM name="CONTROLLER" VALUE="true">
<embed src= "ile.mov" width = "600" heigth = "630" controller="true" pan="140" correction="none" > </embed>
</OBJECT>

Merci d'avance de votre aide
2
arshi
 
slt...a src="chemin de la video" u dw mettr le vrai chemin du genr src="desktop/azerty.mp4"
1
peterpan833 Messages postés 44 Date d'inscription   Statut Membre Dernière intervention   16
 
Voir ci dessous pour plus de clarté sur le problème

http://www.netvideolive.com/images/Image-0085.jpg
0
canalplus
 
..
0
RealPier Messages postés 2 Date d'inscription   Statut Membre Dernière intervention  
 
Il est important de prendre en compte le Doctype de la page !

Si la page est déclarée en HTML4.1, il faut abandonner la balise EMBED et imbriquer 2 balises OBJECT de cette façon :

<object classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" width="165" height="36">
<param name="src" value="adresse_de_votre_fichier.rpm">
<param name="controls" value="ControlPanel">
<param name="autostart" value="true">
<!--[if gte IE 7]> <!-->
<object type="audio/x-pn-realaudio-plugin"
data="adresse_de_votre_fichier.rpm" width="165" height="36">
<param name="controls" value="ControlPanel">
<param name="autostart" value="true">
</object>
<!--<![endif]-->
</object>

Si la page est codée pour HTML5 (qui gère la balise EMBED) le code serait :

<object classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" width="0" height="0">
<param name="src" value="adresse_de_votre_fichier.rpm">
<param name="controls" value="ImageWindow">
<param name="autostart" value="true">
<!--[if gte IE 7]> <!-->
<object type="audio/x-pn-realaudio-plugin"
data="adresse_de_votre_fichier.rpm" width="0" height="0">
<param name="controls" value="ImageWindow">
<param name="autostart" value="true">
</object>
<!--<![endif]-->
</object>

Pour en savoir + : http://opus100.free.fr/fr/realplayer.html
0