Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- $('.open-fancybox').fancybox({
- 'afterShow': function() {
- $('#mediaelement').mediaelementplayer();
- }
- });
- <a class="open-fancybox" href="#fancybox">
- <div id="#fancybox">
- <video id="#mediaelement" src="...mp4">
- </div>
- <script>
- $(document).ready(function(){
- $('video').mediaelementplayer( {
- flashName: '/path_to_mediaelement_swf/flashmediaelement.swf',
- });
- });
- </script>
- <video width="320" height="240" poster="poster.jpg" controls="controls" preload="none">
- <!-- MP4 for Safari, IE9, iPhone, iPad, Android, and Windows Phone 7 -->
- <source type="video/mp4" src="myvideo.mp4" />
- <!-- WebM/VP8 for Firefox4, Opera, and Chrome -->
- <source type="video/webm" src="myvideo.webm" />
- <!-- Ogg/Vorbis for older Firefox and Opera versions -->
- <source type="video/ogg" src="myvideo.ogv" />
- <!-- Optional: Add subtitles for each language -->
- <track kind="subtitles" src="subtitles.srt" srclang="en" />
- <!-- Optional: Add chapters -->
- <track kind="chapters" src="chapters.srt" srclang="en" />
- <!-- Allow the plugin to generate the object markup, preventing the swf source from loading too early -->
- </video>
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
- <script src="fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
- <script src="mediaelement/mediaelement-and-player.min.js" type="text/javascript"></script>
- <link href="mediaelement/mediaelementplayer.css" type="text/css" rel="stylesheet">
- <link href="fancybox/jquery.fancybox-1.3.4.css" type="text/css" rel="stylesheet">
- $(document).ready(function() {
- $('a.inline').fancybox({
- 'transitionIn' : 'fade',
- 'transitionOut' : 'fade'
- });
- $('video').mediaelementplayer({
- pluginPath: 'mediaelement/'
- });
- });
- <div>
- <a class="inline" href="#video"><img src="images/homepage/video.png"></a>
- </div>
- <div style="display:none;">
- <div id="video">
- <video width="640" height="360" poster="images/homepage/videoPreview.jpg">
- <source type="video/mp4" src="video/uA_V1.mov">
- </video>
- </div>
- </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement