begin process at 2012 05 28 14:26:18
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Graphique

 > PLAYER VIDEO HTML À BONDER

PLAYER VIDEO HTML À BONDER


 Information sur la source

Note :
8 / 10 - par 1 personne
8,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Graphique Classé sous :html5, video, player, media, bindable Niveau :Débutant Date de création :26/04/2011 Vu / téléchargé :3 565 / 398
Auteur : Hakumbaya

Ecrire un message privé
Ce membre participe au partage de revenus publicitaires
Commentaire sur cette source (6)
Ajouter un commentaire et/ou une note

 Description

On va dire que l'on reinvente la roue, mais voila un petit code tout simple permetant d'exploitater le player video HTML5 sans vraiment se poser de question. On crée une <div> dans laquelle on souhaite placer la video, on appelle la fonction "GlueVideoOn" en passant en parametre d'id de la div, le chemin d'accès du fichier ogg, ogv ou mp4, et un 3eme parametre facultatif pour l'autoplay...et c'est tout !

Qu'est ce que cette source apporte en plus ?
J'avoues que le contrôleur d'origine ne me plaisait pas beaucoup, et de plus pouvait changer selon les navigateur, j'ai donc fait une surcharge épurée du contrôleur qui vient se greffer comme un grand sous la vidéo sans parasiter le code javascript.

Les images du player sont clipées, cela fait perdre un peu en lisibilté le code, mais une fois mis en cache, le chargement interface est on ne peut plus rapide ^^.

Source

  • <!-- On ne peut faire que difficilement plus simple !-->
  • <html>
  • <head>
  • <script language="javascript" src="gluevideohtml5.js"></script>
  • <body>
  • <div id="video_displayer" style="height: 250px; width: 400px;"></div>
  • <script language="javascript">
  • GlueVideoOn('video_displayer', 'oceans-clip.ogv', false);
  • </script>
  • </body>
  • </html>
<!-- On ne peut faire que difficilement plus simple !-->
<html>
	<head>
		<script language="javascript" src="gluevideohtml5.js"></script>
	<body>
		<div id="video_displayer" style="height: 250px; width: 400px;"></div>
		<script language="javascript">
			GlueVideoOn('video_displayer', 'oceans-clip.ogv', false);
		</script>
	</body>
</html>

 Conclusion

on sens avec l'arrivée de HTML5 un fort essoufflement de Flash, bien qu'il soit toujours indispensable pour les script nécessitant un accès aux pilotes (webcam online par exemple), mais perd de plus en plus de son influence face à la déconcertante facilité avec laquelle se manipule le player video HTML 5.

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Sources du même auteur

Source avec Zip Source avec une capture 3D AVEC WEBGL + MESH
Source avec Zip Source avec une capture 3D AVEC WEBGL
Source avec Zip Source avec une capture CANVAS I3D : 3D SOUS JAVASCRIPT SANS WEGGL
Toutes les sources de Hakumbaya

 Sources de la même categorie

Source avec Zip JDMATH-MINI.JS : GÉNÉRATION D'EXPRESSION MATHÉMATIQUE par jdmcreator
Source avec une capture SPHERE 3D DÉFORMABLE par phm
Source avec Zip Source avec une capture EFFET DE ROTATION A 360° D'IMAGE AVEC ACCELERATION DECELERAT... par kazma
Source avec Zip Source avec une capture PETIT LOGICIEL DE DESSIN, RETOUCHE AVEC CANVAS par kazma
Source avec Zip Source avec une capture CALCULATRICE HEURE par m22001111
Toutes les sources de la catégorie Graphique

 Sources en rapport avec celle ci

Source avec Zip Source avec une capture HTML5 PLAYER par kazma
Source avec Zip Source avec une capture PETIT LECTEUR AUDIO HTML 5 par maichafred
Source avec Zip PSEUDO CLASS JAVASCRIPT PERMET LE STORAGE(HTML5) D'UN TABLEA... par Magelo
Source avec Zip Source avec une capture VIDEO EN FOND DE PAGE WEB (HTML5) par BarbuJack
Source avec Zip Source avec une capture WINDOWS MEDIA PLAYER POUR SITE EN HTML par fracker

Commentaires et avis

Commentaire de inaden le 02/05/2011 07:38:23

Bonjour,
je lance la page... chargement en cours... et rien ne se passe.

Commentaire de 01wbm le 02/05/2011 09:33:40

Bonjour
Félicitations pour le travail réalisé sur ce player, deux questions d'un novice, faut il impérativement que le fichier soit encodé en ogv et existe t'il la possibilité du plein écran ?
Merci par avance 01wbm

Commentaire de proftnj le 02/05/2011 21:57:32

Ne fonctionne pas avec IE7.
OK avec FF mis à jour.

Commentaire de Hakumbaya le 14/06/2011 10:36:17

Bien evidement pour ceux qui se ponsent la question, le player video est une technologie HTML5, inutile d'essayer de la faire marcher juste un navigateur qui à plus de 6 mois.

Pour ce qui est des formats, 3 sont disponibles : MP4 (h264), oGv (ogg license libre media video) et enfin webm (peut etre le prochain standard des formats videos en ligne).
Actuellement :
- Firefox => OGV, Webm à partir de la version 4.0
- IE9 => Webm (Pas pas fiable du tout)
- Chrome => MP4 ou Webm
- Safari => OGV (pas testé sous toutes les version)
- Netscape => même pas en reve XD

Commentaire de HACKANDROID le 13/09/2011 22:08:06 8/10

Bon lecteur vidéo en html5 mais tu aurais pu faire mieux (Manque d'option CONNUE).

Commentaire de Hakumbaya le 14/09/2011 12:32:59

Tout à fait, mais regarde bien, le code commence sérieusement à dater, au moment ou ca a été posté, la gestion de la vidéo par HTML5 etait encore toute fraiche et peu fiable ^^

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Controler le media player avec javascript [ par spyro666 ] Voil&#224;, je suis en train de cr&#233;er un petit prog qui permettrait de recenser mes MP3 et de les lancer. Jusqu'&#224; ici pas de probl&#232;me, Media Player + menu [ par PROTECTIONNISTE ] Salut,Je suis entrain de cr&#233;er un lecteur en html javscript, avec un menu d&#233;roulant,mais j'ai un soucis quand je d&#233;roule le menu (verti help !!!! création d'1 media player avec diviseur d'ecran [ par io_s ] slt &#224; tous , je suis d&#233;butante en java et donc je voudrez que vous m'aidiez&nbsp;( si qq'1 veut bien)&nbsp;&#224; cr&#233;er un media playe Media Player Divx Download time [ par astroinv ] Bonjour,PB simple, une page HTML, un Objet Media player qui a comme source un fichier DIVX de plus de 10 Mo. Comme le DIVX n'est pas streamer, il faut Playlist Windows Media Player [ par tangsx ] Bonsoir,Je cherche un moyen de fournir plusieurs fichiers .mp3 au lecteur Windows Media Player embarqué dans une page html (&lt;embed&gt;). Les fichie Media Player JS [ par cheslot ] Bonjour à tous. Je cherche désespérément à faire un media player en js. Je souhaite en faire un version HTA.[^^happy3] J'ai toutes mes sources. Il ne fermer fenetre blanche qui s'ouvre en meme temp que media player [ par mike0707 ] Bonjour, j'espère etre au bon endroit, car sa fait des jours que je cherche comment faire pour empêcher un nouvel onglet vierge de s'ouvrir lorsque j browser de set top box (Galio) sous javascript lire une video ?? [ par metal76 ] je test une set top box, j'accéde à ses dossiers via putty, je peux afficher une page de test sur mon écran télé ( une page HTML/javascript lancé par séquencer en javascript [ par metal76 ] bonjour , j'ai réaliser une page de test pour pouvoir regarder du multicast je vous envoie le code HTML/javascript de cette page donc je voudrais en lecteur video flash + javascript [ par stonedbike ] Bonjour, J'ai cherché mais n'ai pas trouvé de réponse à mon problème... J'ai sur mon site une série d'images ; j'aimerais que pour chacune d'entre e


Nos sponsors


Sondage...

Comparez les prix


Samsung Galaxy Tab (GT-P1000) Tablet PC
Entre 699€ et 699€

Visiter le guide achat

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 2,184 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)