Advertisement
Guest User

Untitled

a guest
Aug 3rd, 2013
152
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.13 KB | None | 0 0
  1. $('.open-fancybox').fancybox({
  2. 'afterShow': function() {
  3. $('#mediaelement').mediaelementplayer();
  4. }
  5. });
  6.  
  7. <a class="open-fancybox" href="#fancybox">
  8. <div id="#fancybox">
  9. <video id="#mediaelement" src="...mp4">
  10. </div>
  11.  
  12. <script>
  13. $(document).ready(function(){
  14. $('video').mediaelementplayer( {
  15. flashName: '/path_to_mediaelement_swf/flashmediaelement.swf',
  16. });
  17. });
  18. </script>
  19.  
  20. <video width="320" height="240" poster="poster.jpg" controls="controls" preload="none">
  21. <!-- MP4 for Safari, IE9, iPhone, iPad, Android, and Windows Phone 7 -->
  22. <source type="video/mp4" src="myvideo.mp4" />
  23. <!-- WebM/VP8 for Firefox4, Opera, and Chrome -->
  24. <source type="video/webm" src="myvideo.webm" />
  25. <!-- Ogg/Vorbis for older Firefox and Opera versions -->
  26. <source type="video/ogg" src="myvideo.ogv" />
  27. <!-- Optional: Add subtitles for each language -->
  28. <track kind="subtitles" src="subtitles.srt" srclang="en" />
  29. <!-- Optional: Add chapters -->
  30. <track kind="chapters" src="chapters.srt" srclang="en" />
  31. <!-- Allow the plugin to generate the object markup, preventing the swf source from loading too early -->
  32.  
  33. </video>
  34.  
  35. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
  36. <script src="fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
  37. <script src="mediaelement/mediaelement-and-player.min.js" type="text/javascript"></script>
  38. <link href="mediaelement/mediaelementplayer.css" type="text/css" rel="stylesheet">
  39. <link href="fancybox/jquery.fancybox-1.3.4.css" type="text/css" rel="stylesheet">
  40.  
  41. $(document).ready(function() {
  42. $('a.inline').fancybox({
  43. 'transitionIn' : 'fade',
  44. 'transitionOut' : 'fade'
  45. });
  46. $('video').mediaelementplayer({
  47. pluginPath: 'mediaelement/'
  48. });
  49. });
  50.  
  51. <div>
  52. <a class="inline" href="#video"><img src="images/homepage/video.png"></a>
  53. </div>
  54. <div style="display:none;">
  55. <div id="video">
  56. <video width="640" height="360" poster="images/homepage/videoPreview.jpg">
  57. <source type="video/mp4" src="video/uA_V1.mov">
  58. </video>
  59. </div>
  60. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement