index.html 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <!-- player skin -->
  5. <link type="text/css" rel="stylesheet" href="skin/minimalist.css">
  6. <script language="javascript" type="text/javascript" src="../jquery-1.8.0.min.js"></script>
  7. <script language="javascript" type="text/javascript" src="flowplayer.js"></script>
  8. <script language="javascript" type="text/javascript" src="embed.min.js"></script>
  9. </head>
  10. <body>
  11. <div id="player" class="fixed-controls" style="width:400px; height:260px;"></div>
  12. <div id="log"></div>
  13. <a href="javascript:load2();" >ÁíÍâÒ»¸öÊÓƵ</a>
  14. <script language="javascript" type="text/javascript">
  15. var player;
  16. $(function () {
  17. player = flowplayer("#player", {
  18. autoplay: true,
  19. ratio: 5 / 12,
  20. clip: {
  21. sources: [{ type: "application/x-mpegurl", src: "http://183.232.77.53/Movies/20160310/145718007/x.m3u8"}],
  22. //sources: [{ type: "video/mp4", src: "http://183.232.77.53/Movies/20160310/145718007/x.mp4"}],
  23. title: ""
  24. },
  25. embed: {
  26. skin: "skin/minimalist.css"
  27. }
  28. });
  29. //player.load();
  30. //player.play();
  31. });
  32. flowplayer(function (api) {
  33. api.on("load ready", function (e, api, video) {
  34. var log = $("#log").append(e.type + ": " + video.src + ", duration: " +
  35. (video.duration || "not available"));
  36. if (e.type == "ready") {
  37. player.seek(60);
  38. }
  39. $(".fp-brand").remove();
  40. $(".fp-embed").remove();
  41. });
  42. api.on("progress", function (e, api, video) {
  43. var log = $("#log").append(e.type + ":time: "+video);
  44. });
  45. });
  46. function load2() {
  47. player.load("1.mp4");
  48. }
  49. </script>
  50. </body>
  51. </html>