I cookie permettono il funzionamento di alcuni servizi di questo blog. Utilizzando questi servizi, accetti l'utilizzo dei cookie da parte nostra. Ok Rifiuta

Un ottimo player video per siti web: Flowplayer

E' possibile che agli sviluppatori web venga chiesto di far visualizzare dei video che vengono caricati dal cliente, di solito tramite un gestionale. Questa funzionalità è tipica di siti web per tv private o pubbliche, streaming video, per videoguide su blog o portali italiani di settore. Quindi per soddisfare questa richiesta dobbiamo ricorrere a vari linguaggi, in particolare al linguaggio HTML 5 e al linguaggio Flash.

Sulla rete ci sono moltissimi player che possono essere integrati nelle applicazioni web, molti a pagamento; io vi consiglio, per semplicità di utilizzo, un ottimo player da integrare: Flowplayer. Flowplayer è semplice e minimalistico, design fluido, e offre una personalizzazione completa. Iniziamo a creare una pagina di esempio per incorporare il player:

<!doctype html>

<head>

   <link rel="stylesheet" type="text/css" href="skin/minimalist.css">//skin del player

   <style type="text/css">
   body { font: 12px "Myriad Pro", "Lucida Grande", sans-serif; text-align: center; padding-top: 5%; } //css custom
   .flowplayer { width: 80%; }
   </style>

   <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> //importiamo jquery 1.7.1 o superiore

   <script type="text/javascript" src="flowplayer.min.js"></script> //includiamo lo script base di Flowplayer

</head>

<body>
   <div class="flowplayer" data-swf="flowplayer.swf" data-ratio="0.4167"> //questo è il div del player vero e proprio
      <video>
         <source type="video/webm" src="http://stream.flowplayer.org/bauhaus/624x260.webm">//queste sono le sorgenti video in .mp4, .webm, e .ogv
         <source type="video/mp4" src="http://stream.flowplayer.org/bauhaus/624x260.mp4">
         <source type="video/ogv" src="http://stream.flowplayer.org/bauhaus/624x260.ogv">
      </video>
   </div>
</body>

Come vedete è un codice HTML 5 veramente semplice da creare e da customizzare a piacere. Ovviamente sul sito ci sono molti consigli sull'uso, un forum e il link di download per gli altri file che completano il player.

I più letti

Seguici su Facebook

Seguici su Google+

Renzo Cappelli

miafoto

Sono un appassionato di informatica, mi dedico allo sviluppo web e alla gestione dei sistemi web-based: realizzo siti e progetto software gestionale per privati e aziende. Ho tanta passione per tutto quello che riguarda il web e le nuove tecnologie, lavoro bene in team e collaboro con aziende e professionisti di settore.

Commenti

NON CI SONO ANCORA COMMENTI.

Lascia il tuo commento