Okay, dai un'occhiata ai video-js, è piuttosto carino. Prova questo:
HTML:
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/c/video.js"></script>
</head>
<body>
<div id="content"> </div>
<!-- appending video here -->
<hr />
<!-- written in html -->
<video id="example_video_by_hand" class="video-js vjs-default-skin" controls width="640" height="264" poster="http://video-js.zencoder.com/oceans-clip.jpg" preload="auto" data-setup="{}">
<source type="video/mp4" src="http://video-js.zencoder.com/oceans-clip.mp4">
</video>
</body>
</html>
JavaScript:
var obj,
source;
obj = document.createElement('video');
$(obj).attr('id', 'example_video_test');
$(obj).attr('class', 'video-js vjs-default-skin');
$(obj).attr('width', '640');
$(obj).attr('data-height', '264');
$(obj).attr('controls', ' ');
$(obj).attr('poster', 'http://video-js.zencoder.com/oceans-clip.jpg');
$(obj).attr('preload', 'auto');
$(obj).attr('data-setup', '{}');
source = document.createElement('source');
$(source).attr('type', 'video/mp4');
$(source).attr('src', 'http://video-js.zencoder.com/oceans-clip.mp4');
$("#content").append(obj);
$(obj).append(source);
Working example su jsbin.
Aggiornamenti:
Come polarblau sottolineato in un commento del jQuery.attr()
può prendere un oggetto, piuttosto che dover chiamare jQuery.attr()
più volte, come nel mio primo esempio.
nota: Il seguente è solo un esempio e non una demo funzionante.
var attributes = {
'id': 'example_video_test',
'class': 'video-js vjs-default-skin',
'width': '640',
'data-height': '264',
'controls': ' ',
'poster': 'http://video-js.zencoder.com/oceans-clip.jpg',
'preload': 'auto',
'data-setup': '{}'
}
var element = $('<video/>').attr(attributes)
//you would also have to add the source element etc but this gives
//a good example of a shorter approach
Funziona, grazie! Vedo che non c'è bisogno nella funzione _V_ come indicato nel sito Web VideoJS. – Light
OT: '.attr()' accetta anche un oggetto che consente di impostare tutti gli attributi in una sola seduta. Anche la memorizzazione nella cache di oggetti jQuery in variabili è una buona pratica: 'var $ obj = $ ('') .attr ({...}) ...'. – polarblau
Solo una nota, puoi anche fare molte impostazioni video in VJS (preferibilmente). Puoi semplicemente impostare un video con un ID, quindi utilizzare Videojs per inizializzare il player con opzioni e un nuovo src. –