Xyberneticos » Video http://xyberneticos.com Desarrollo Web, Diseño, Recursos, Wordpress, Themes Fri, 04 Nov 2011 14:10:38 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 Video JS – Reproductor de vídeo en HTML5 http://xyberneticos.com/index.php/2011/01/14/video-js-reproductor-de-video-en-html5/ http://xyberneticos.com/index.php/2011/01/14/video-js-reproductor-de-video-en-html5/#comments Fri, 14 Jan 2011 04:41:59 +0000 Nikko http://xyberneticos.com/?p=3090

Video JS es un reproductor de video basado en JavaScript que utiliza la funcionalidad de video HTML5 de los navegadores avanzados. En general, la ventaja de utilizar un reproductor de HTML5 es un aspecto coherente entre los navegadores.

WordPress HTML5 Reproductor de vídeo

Para utilizar HTML5 Video en WordPress, necesitaran un plugin adicional. HTML5 video player plugin for WordPress , el plug-in les permitira utilizar la etiqueta [video] para integrar HTML5 Video , y VideoJS para que funcione correctamente.

PLAIN TEXT
JavaScript:
<head>
  ...
    <script src="video.js" type="text/javascript" charset="utf-8"></script>
    <link rel="stylesheet" href="video-js.css" type="text/css" media="screen" title="Video JS" charset="utf-8">
  ...
<script type="text/javascript" charset="utf-8">
    // Add VideoJS to all video tags on the page when the DOM is ready
    VideoJS.setupAllWhenReady();
  </script>

  </head>

PLAIN TEXT
HTML:
<!-- Begin VideoJS -->
  <div class="video-js-box">
    <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
    <video class="video-js" width="640" height="264" controls preload poster="http://video-js.zencoder.com/oceans-clip.png">
      <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
      <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm; codecs="vp8, vorbis"' />
      <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg; codecs="theora, vorbis"' />
      <!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. -->
      <object class="vjs-flash-fallback" width="640" height="264" type="application/x-shockwave-flash"
        data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf">
        <param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" />
        <param name="allowfullscreen" value="true" />
        <param name="flashvars" value='config={"playlist":["http://video-js.zencoder.com/oceans-clip.png", {"url": "http://video-js.zencoder.com/oceans-clip.mp4","autoPlay":false,"autoBuffering":true}]}' />
        <!-- Image Fallback. Typically the same as the poster image. -->
        <img src="http://video-js.zencoder.com/oceans-clip.png" width="640" height="264" alt="Poster Image"
          title="No video playback capabilities." />
      </object>
    </video>
    <!-- Download links provided for devices that can't play video in the browser. -->
    <p class="vjs-no-video"><strong>Download Video:</strong>
      <a href="http://video-js.zencoder.com/oceans-clip.mp4">MP4</a>,
      <a href="http://video-js.zencoder.com/oceans-clip.webm">WebM</a>,
      <a href="http://video-js.zencoder.com/oceans-clip.ogv">Ogg</a><br>
      <!-- Support VideoJS by keeping this link. -->
      <a href="http://videojs.com">HTML5 Video Player</a> by VideoJS
    </p>
  </div>
  <!-- End VideoJS -->

]]> http://xyberneticos.com/index.php/2011/01/14/video-js-reproductor-de-video-en-html5/feed/ 1 ToobPlayer – Practico FLV Player para integrar tus videos Youtube a tus proyectos online http://xyberneticos.com/index.php/2008/07/08/toobplayer-practico-flv-player-para-integrar-tus-videos-youtube-a-tus-proyectos-online/ http://xyberneticos.com/index.php/2008/07/08/toobplayer-practico-flv-player-para-integrar-tus-videos-youtube-a-tus-proyectos-online/#comments Tue, 08 Jul 2008 04:02:55 +0000 Nikko http://xyberneticos.com/index.php/2008/07/08/toobplayer-practico-flv-player-para-integrar-tus-videos-youtube-a-tus-proyectos-online/ toobplayer.jpg

ToobPlayer es un extraordinario FLV Player que permitirá montar a tu Web aquellos videos youtube que disfrutas ver, pero dando al reproductor un aspecto mucho mas personalizado o simulando haberlos alojado en nuestro propio servidor. ToobPlayer no solo se caracteriza por ser un mecanismo para reproducir videos de YouTube, sino que también podremos crear con el, vistas previas de imágenes al mejor estilo galerías. Encontraremos cinco Skin ya prediseñados, lo que será toda una ventaja, y asegurara que la integración a nuestro blog sea lo mas bonita posible, permite visualización a pantalla completa, puede manipularse en caso de desearlo con nuestro ratón (controlar volumen, etc), y mas haya de ser súper liviano, es totalmente personalizable, lo que hace que sea una alternativa genial.

Mas Demos - Descarga ToobPlayer 1.0.0

Via pixelco

]]> http://xyberneticos.com/index.php/2008/07/08/toobplayer-practico-flv-player-para-integrar-tus-videos-youtube-a-tus-proyectos-online/feed/ 10 FlowPlayer – Poderoso y flexible video player (open source) para tu web http://xyberneticos.com/index.php/2008/03/13/flowplayer-poderoso-y-flexible-video-player-open-source-para-tu-web/ http://xyberneticos.com/index.php/2008/03/13/flowplayer-poderoso-y-flexible-video-player-open-source-para-tu-web/#comments Thu, 13 Mar 2008 06:02:56 +0000 Nikko http://xyberneticos.com/index.php/2008/03/13/flowplayer-poderoso-y-flexible-video-player-open-source-para-tu-web/ flowplayer.jpg

FlowPlayer poderoso y flexible video player (open source) que te permitirá insertar diferentes formatos multimedia FLV, SWF, MP3, MP4, H.264 video, JPG y PNG en tu sitio Web, sin necesidad de recurrir a sitios externos como puede ser Youtube. FlowPlayer posee características extraordinarias, que van desde la adaptación de skin o colores, para adaptar lo mejor posible el reproductor a los tonos de tu web, como así también opciones que podemos encontrar en servicios tradicionales, por ejemplo la opción de compartir nuestro video vía email, Embed (permitir a los usuarios insertar nuestro video en sus sitios web) etc.
Mas características:

  • Protección contra enlaces directos: Podrás proteger tus vídeos e imágenes contra en enlace directo.
  • Soporte para publicidad: La listas de reproducción permite insertar publicidad en los stream de los vídeos. Además los controles de vídeo se pueden desactivar cuando sale la publicidad, y por supuesto la publicidad enlazada al anunciante.
  • Soporte para modo de pantalla completa.
  • y mucho, mucho mas ....

Enlace FlowPlayer
Via Infectedfx - Carrero

]]> http://xyberneticos.com/index.php/2008/03/13/flowplayer-poderoso-y-flexible-video-player-open-source-para-tu-web/feed/ 4