Monday, June 3, 2024
 Popular · Latest · Hot · Upcoming
100
rated 0 times [  101] [ 1]  / answers: 1 / hits: 37951  / 13 Years ago, tue, august 2, 2011, 12:00:00

I have been using the JavaScript script VideoJS: http://videojs.com/ to build some video players that can be shown to the user in a popup. I have built the popup as follows:



        <script type=text/javascript> 

VideoJS.setupAllWhenReady();

jQuery(document).ready(function ()
{
// videos have video js applied to them
//$(video).VideoJS()

$(.show-video).click(function ()
{
$(.video-background).show();
$(.video-container).fadeIn(fast);
});
$(.close-video).click(function ()
{
$('.video-background').fadeOut();
$('.video-container').fadeOut();

});
});
</script>

<a class=show-video>Show Video</a>

<div class=video-background>
<div class=video-container>

<div class=video-js-box vim-css>
<video id=video1 class=video-js poster=wallpaper.png controls=controls width=1024 height=768>
<source src=video.mp4 type='video/mp4; codecs=avc1.42E01E, mp4a.40.2' />
<object id=flash_fallback_1 class=vjs-flash-fallback width=1024 height=768 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:[poster.png, {url: video.mp4,autoPlay:false,autoBuffering:true}]}' />
</object>
</video>
</div>

<a class=close-video>Close Video</a>

</div>
</div>


I have two problems:



1) If the video is playing and the user closes the video popup, the video will still be playing in the background... how do I stop this?



2) I've noticed on sites like: http://www.apple.com/imac/features.html that the videos popup in the same way by using a hashtag and id to show content but unlike in my example the video isn't in the page... any ideas on how they do this? As they arn't loading an external webpage. Would love to see some examples of how to do this with jQuery as I will be having multiple videos so would be great to just pull them in based on the hashtag on the link!



Thanks


More From » jquery

 Answers
15

There are 2 ways you can do this.




  1. Remove the whole video when the popup is closed. Use $(video).remove()

  2. Use the videojs javascript method



    VideoJS.DOMReady(function(){
    var myPlayer = VideoJS.setup(example_video_1);
    myPlayer.pause();
    });


[#90870] Sunday, July 31, 2011, 13 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
admin

Total Points: 468
Total Questions: 103
Total Answers: 103

Location: Equatorial Guinea
Member since Sun, Feb 14, 2021
3 Years ago
;