Sujet Précédent Sujet Suivant

Inserrer UNE Video dans une page HTML.

Fermé
tom@ Messages postés 202 Date d'inscription lundi 21 mars 2005 Statut Membre Dernière intervention 15 juin 2022 - 16 mai 2005 à 01:55
 guy - 13 août 2012 à 18:55
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
A voir également:

12 réponses

Réponse 1 / 12
tom@ Messages postés 202 Date d'inscription lundi 21 mars 2005 Statut Membre Dernière intervention 15 juin 2022 50
16 mai 2005 à 02:13
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 vendredi 12 janvier 2007 Statut Membre Dernière intervention 30 juillet 2010
30 juil. 2010 à 12:38
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
26 déc. 2010 à 22:21
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
21 févr. 2012 à 20:37
Petite question:
Pourquoi les noms de balises sont-ils en MAJUSCULE ?
0
guy
13 août 2012 à 18:55
allez à : http://www.movavi.com/videoconverter/?gclid=COzEgvuH5bECFcMXzQodLR4AQg et télécharger sa
0
Réponse 2 / 12
istary Messages postés 243 Date d'inscription mardi 4 août 2009 Statut Membre Dernière intervention 21 novembre 2011 6
7 févr. 2010 à 14:53
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
Réponse 3 / 12
peterpan833 Messages postés 44 Date d'inscription lundi 8 octobre 2007 Statut Membre Dernière intervention 20 janvier 2017 16
1 nov. 2007 à 14:56
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
Réponse 4 / 12
peterpan833 Messages postés 44 Date d'inscription lundi 8 octobre 2007 Statut Membre Dernière intervention 20 janvier 2017 16
5 nov. 2007 à 22:44
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
Réponse 5 / 12
canalplus
29 juin 2008 à 12:05
comment faire un site dans lequel je pourrais en tant qu'admin, heberger a partir de mon ordinateur une vidéo?
2
Réponse 6 / 12
thundering
3 sept. 2008 à 23:19
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
Réponse 7 / 12
rixan Messages postés 413 Date d'inscription dimanche 27 mai 2007 Statut Membre Dernière intervention 1 mars 2019 43
27 févr. 2009 à 09:49
Merci beaucoup l'ami pour ces explications

Vive la balise <OBJECT>
2
Réponse 8 / 12
chanti
28 mai 2009 à 16:01
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
Réponse 9 / 12
arshi
11 juil. 2010 à 22:41
slt...a src="chemin de la video" u dw mettr le vrai chemin du genr src="desktop/azerty.mp4"
1
Réponse 10 / 12
peterpan833 Messages postés 44 Date d'inscription lundi 8 octobre 2007 Statut Membre Dernière intervention 20 janvier 2017 16
1 nov. 2007 à 16:03
Voir ci dessous pour plus de clarté sur le problème

http://www.netvideolive.com/images/Image-0085.jpg
0
Réponse 11 / 12
canalplus
7 juil. 2008 à 14:58
..
0
Réponse 12 / 12
RealPier Messages postés 2 Date d'inscription mardi 22 novembre 2011 Statut Membre Dernière intervention 23 novembre 2011
23 nov. 2011 à 00:07
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

Discussions similaires

[PIX] Commencer chaque poème sur une nouvelle page
ETHAN -
Willzac -

19 réponses