سؤال

I am having issues with the following code. I need to be able to show and hide this video using the jQuery show() and hide() but when I do the following the video no longer loads:

  1. Click the Show button
  2. Click the Hide button
  3. Click the Show button - The video doesn't load any more.

Note: I can't use visibility hidden / visible.

<script src="http://player.ooyala.com/v3/c4166b7aafc48b1aa965e31f92fd8bd"></script>

<div id="player-wrapper">
    <div id='myPlayer'></div>
</div>

<button id="button1">Show</button>
<button id="button2">Hide</button>

<script>    
    var myPlayer1 = OO.Player.create('myPlayer', 't5bnBnYTrmAV4SZZSwEVyFn9cvieJFOJ', {      
        width: 618, 
        height: 437
    });
</script>

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

<script>
    $("#player-wrapper").hide();

    $("#button1").click(function () {
        $("#player-wrapper").show();
    });

    $("#button2").click(function () {
        $("#player-wrapper").hide();
    });
</script>

لا يوجد حل صحيح

نصائح أخرى

After searching their community website http://community.ooyala.com/t5/Developers-Forum/Show-hide-player-destroy/m-p/1678/highlight/true#M58 I think this might be a way to solve the problem.

<div id="player-wrapper">
    <div id='myPlayer'></div>
</div>

<button id="button1">Show</button>
<button id="button2">Hide</button>

<script src="http://player.ooyala.com/v3/c4166b7aafc48b1aa965e31f92fd8bd"></script>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

<script>
    var myPlayer1;
    $("#player-wrapper").hide();

    $("#button1").click(function () {
        myPlayer1 = OO.Player.create('myPlayer','95eGFoYzoL6qb_jnRK1lkSLUYiKICGg1', {      
            width: 618, 
            height: 437
        });
        $("#player-wrapper").show();
    });

    $("#button2").click(function () {
        $("#player-wrapper").hide();
        myPlayer1.destroy();
    });
</script>

You create the player when you click on the first button and destroying it with the second. There seems to be no real solution to do it in another way.

Hope it helps.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top