Rechercher : dans
Par :

Inserrer UNE Video dans une page HTML.

Dernière réponse le 7 fév 2010 à 14:53:30 tom@, le 16 mai 2005 à 01:55:59 
 Signaler ce message aux modérateurs

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

1

tom@, le 16 mai 2005 à 02:13:23
  • +7

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

Répondre à tom@

2

peterpan833, le 1 nov 2007 à 14:56:15
  • +1

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

Répondre à peterpan833

3

peterpan833, le 1 nov 2007 à 16:03:42

Voir ci dessous pour plus de clarté sur le problème

http://www.netvideolive.com/images/Image-0085.jpg

Répondre à peterpan833

4

peterpan833, le 5 nov 2007 à 22:44:41

Hello

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

valable uniquement pour IE

Répondre à peterpan833

5

canalplus, le 29 jun 2008 à 12:05:38

Comment faire un site dans lequel je pourrais en tant qu'admin, heberger a partir de mon ordinateur une vidéo?

Répondre à canalplus

6

canalplus, le 7 jui 2008 à 14:58:18

..

Répondre à canalplus

7

thundering, le 3 sep 2008 à 23:19:16

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

Répondre à thundering

8

rixan, le 27 fév 2009 à 09:49:00

Merci beaucoup l'ami pour ces explications

Vive la balise <OBJECT>

Répondre à rixan

9

chanti, le 28 mai 2009 à 16:01:57
  • +1

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

Répondre à chanti

10

 istary, le 7 fév 2010 à 14:53:30

Bonjour, j'ai utilisé le code suivant :

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

codebase="http://activex.microsoft.com/..."
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>


Ma video ne s'affiche pas :s
Pourquoi ?

Merci d'avance

Répondre à istary