5 Replies Latest reply on Mar 16, 2015 2:13 PM by fedorv64812277

    How to create several youtubeclips in different videocontainers

    mood_sol

      Hi guys,

      i'm new in edge and in this forum:

       

       

      I've read all the discussion about create several youtube clips in a single container :

       

      http://forums.adobe.com/message/4722007#4722007

       

      What i need to do is to have diffrent containers in the same page with different you tube videos.

      I've tried one single container and the method suggested by RUSSmsn :

       

      ///////////////////////////////////

           ///////////////////////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////

           1. RussMSN,

       

                

             18-set-2012 5.05    in reply to Kirch12

       

           So, the way I did it was like this:

       

       

           Create the button and open the code panel for that button.  Create a click action.  Within the code panel, paste this:

       

           var youtubevid = $("<iframe/>");
           sym.$("vcontainer").empty().append(youtubevid);
           youtubevid.attr('type','text/html');
           youtubevid.attr('width','425');
           youtubevid.attr('height','350');

           youtubevid.attr('src','http://www.youtube.com/embed/ykF1y2EJ2nI');  // url/Video_Id
           youtubevid.attr('frameborder','1');       // 1 | 0
           youtubevid.attr('allowfullscreen','0');   // 1 | 0

       

           What that does is empty the existing vcontainer, and places a new one with the new youtube video.  You can add this to as many buttons as you like,      obviously changing the URL ID for each, and it Should swap the video for you on click.

           Hope that helps!

       

           Russ

           ///////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////

      ///////////////////////////

       

      and it works perfectly....

       

      The problem is i want to add more videos in the same page...

      I've tried to create

      var youtube2 and vcontainer2 but it didn't work....

      So i tried moving my first vcontainer to the second position in my page adding a label "button2" :

       

      //start code

       

           sym.play("button2");

       

      var youtubevid = $("<iframe/>");

      sym.$("vcontainer").empty().append(youtubevid);

      youtubevid.attr('type','text/html');

      youtubevid.attr('width','800');

      youtubevid.attr('height','390');

      youtubevid.attr('src','http://www.youtube.com/embed/ykF1y2EJ2nI');  // url/Video_Id

      youtubevid.attr('frameborder','1');       // 1 | 0

      youtubevid.attr('allowfullscreen','0');   // 1 | 0

       

           //end code

       

      but this solution didn't work neither....

       

      I'm asking if is possible to have 2 videos in the same page...

      I've followed also the suggestion of .heathrowe :

       

      http://www.heathrowe.com/adobe-edge-preview-4-append-youtube-video/

       

      Again in the stage action panel after creating a composition ready i've tried to add a second var youtubevid2 and a second container vcontainer2 like this:

       

      //start

       

      var youtubevid = $("<iframe/>");

      sym.$("vcontainer").append(youtubevid);

      youtubevid.attr('type','text/html');

      youtubevid.attr('width','800');

      youtubevid.attr('height','390');

      youtubevid.attr('src','http://www.youtube.com/embed/GqcPh3OXoNo');  // url/Video_Id

      youtubevid.attr('frameborder','1');       // 1 | 0

      youtubevid.attr('allowfullscreen','0');   // 1 | 0

       

      var youtubevid2 = $("<iframe/>");

      sym.$("vcontainer2").append(youtubevid);

      youtubevid.attr('type','text/html');

      youtubevid.attr('width','800');

      youtubevid.attr('height','390');

      youtubevid.attr('src','http://www.youtube.com/embed/DF6QvYNHjQ');  // url/Video_Id

      youtubevid.attr('frameborder','1');       // 1 | 0

      youtubevid.attr('allowfullscreen','0');   // 1 | 0

       

      //end

       

       

      ----but again it didn't worked

       

      To be clear i want to create a page similar to www.bestofyoutube.com with a list of two or more videos in the same page...

       

      Any suggestions ??

       

      Thanks in advance