Page 1 of 5 123 ... LastLast
Results 1 to 10 of 44

Thread: Embedded multi player (video)

  1. #1
    Join Date
    Mar 2009
    Posts
    74
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default Embedded multi player (video)

    Not sure if this is actually what it's called.

    I'm also not sure if it's flash. Basically I'd like one video player which can play a youtube playlist, or list I code to play in it.

    It's here on this site www - dot - tsn.ca

    It's a sports site which has a single video player on the right hand side play news stories the guests click on. You never leave the page though, no matter what news story is clicked.

    Is there something like that, here? Closest I've found is the content glider, but that's for graphics.

    Thank you

  2. #2
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,935
    Thanks
    16
    Thanked 303 Times in 302 Posts
    Blog Entries
    11

    Default

    There's a download in this thread that might help: http://www.dynamicdrive.com/forums/s...ad.php?t=47803
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  3. #3
    Join Date
    Mar 2009
    Posts
    74
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default

    Hi BeverlyH, thank you for responding.

    I'm going to give this a shot after the gym. And see how it goes. I'll update either later on this evening or tomorrow.

    Thank you

  4. #4
    Join Date
    Mar 2009
    Posts
    74
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Beverleyh View Post
    There's a download in this thread that might help: http://www.dynamicdrive.com/forums/s...ad.php?t=47803
    Unfortunately, this isn't what I'm looking for. Though your page ultimately is how I'd like my video player to be setup, (with the ability to play all videos on the page in one player).

    My goal is to have my player play streaming video....a.k.a [youtube]

    I don't host any video because the video I play is copyrighted material. If I host it on my server I can be prosecuted.

  5. #5
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,935
    Thanks
    16
    Thanked 303 Times in 302 Posts
    Blog Entries
    11

    Default

    The latest version of JW Player can stream youtube videos - never tried it myself though: http://www.longtailvideo.com/players/jw-flv-player/
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  6. #6
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,336
    Thanks
    30
    Thanked 137 Times in 132 Posts
    Blog Entries
    32

    Default

    If you're looking for something like THIS (raw version), I can make something for you.
    (HERE's a sophisticated example of the technique)
    ===
    Arie Molendijk
    Last edited by molendijk; 07-13-2011 at 12:53 PM. Reason: Providing an example of the technique

  7. #7
    Join Date
    Mar 2009
    Posts
    74
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default

    Hi Molendijk, thank you for reply.

    Well....yes and no. Ultimately I'd like for my player to be 352x240 size with 4-5 video links below it. If a guest clicks any link. Each one will play in the same player.

    All of the links would be hotlinked youtube videos. It doesn't need to be very extravagant either.

    Is that possible?

    Thank you

  8. #8
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,336
    Thanks
    30
    Thanked 137 Times in 132 Posts
    Blog Entries
    32

    Default

    That's possible. I'll come back to you in a couple of hours (have to leave now).
    ===
    Arie.

  9. #9
    Join Date
    Mar 2009
    Posts
    74
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by molendijk View Post
    That's possible. I'll come back to you in a couple of hours (have to leave now).
    ===
    Arie.
    Excellent, I appreciate your help. I'll look for you later. Have a nice day.

  10. #10
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,336
    Thanks
    30
    Thanked 137 Times in 132 Posts
    Blog Entries
    32

    Default

    You can try something like this:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <title></title>
    
    <style type="text/css">
    body {font-family: verdana; font-size:12px}
    #video_container, #hider1, #hider2
    {position:absolute; left:50%; top:50%; margin-top:-170px; margin-left:-176px; width: 352px; height:240px; overflow:hidden}
    #hider1, #hider2{background:black;color:white; display:none;}
    </style>
    
    <script type="text/javascript">
    function include_video_prep(url)
    {
    video='<object id="the_video" type="application/x-shockwave-flash"  style="position:absolute;width:100%;height:100%;" data='+'"'+url+'"'+'><param name="movie" value='+'"'+url+'"'+'><param name="allowFullScreen" value="true"><param name="flashvars" value="autoplay=1"><param name="wmode" value="window"><param name="allowNetworking" value="all" ><param name="allowscriptaccess" value="always"><\/object>'
    
    setTimeout("document.getElementById('video_container').innerHTML=video",0);
    }
    
    function include_video(which)
    {
    document.getElementById('hider1').style.display='block';
    document.getElementById('hider2').style.display='block';
    include_video_prep(which);
    setTimeout("document.getElementById('hider1').style.display='none'; document.getElementById('hider2').style.display='none'",500); 
    }
    </script>
    
    </head>
    
    <body ><div>
    <div id="video_container"></div>
    
    <div id="hider1">
    <iframe style="position:absolute;width:100%;height:100%;" src="http://www.youtube.com/apiplayer" frameborder="0"></iframe>
    </div>
    
    <div id="hider2" ></div>
    
    <div style="position:absolute; top:50%; left:50%; margin-top:90px; margin-left: -225px">
    
    Click on a link -> 
    <a href="javascript: void(0)" onclick="include_video('http://www.youtube.com/v/1CZpRG4oMms?version=3&amp;rel=0&amp;autoplay=1&amp;showinfo=0&amp;start=0&amp;autohide=0')">Fiddler</a>&nbsp;&nbsp;
    
    <a href="javascript: void(0)" onclick="include_video('http://www.youtube.com/v/g32oijfkhH4?version=3&amp;rel=0&amp;autoplay=1&amp;showinfo=0&amp;start=0&amp;autohide=0')">Errol</a>&nbsp;&nbsp;
    
    <a href="javascript: void(0)" onclick="include_video('http://www.youtube.com/v/jUvcyyU7UB4?version=3&amp;rel=0&amp;autoplay=1&amp;showinfo=0&amp;start=0&amp;autohide=0')">Arkansas</a>&nbsp;&nbsp;
    
    <a href="javascript: void(0)" onclick="include_video('http://www.youtube.com/v/vt4X7zFfv4k?version=3&amp;rel=0&amp;autoplay=1&amp;showinfo=0&amp;start=0&amp;autohide=0')">Soccer</a>&nbsp;&nbsp;
    
    <a href="javascript: void(0)" onclick="include_video('http://www.youtube.com/v/Wz1W_omigwg?version=3&amp;rel=0&amp;autoplay=1&amp;showinfo=0&amp;start=0&amp;autohide=0')">Spooky</a>&nbsp;&nbsp;
    
    <a href="javascript: void(0)" onclick="document.getElementById('video_container').innerHTML=''">Hide</a>
    </div>
    
    </div></body>
    
    </html>
    The styles are just examples. I made it so that there's no flicker on video-transition.
    The links have the following form:
    onclick="include_video('http://www.youtube.com/v/1CZpRG4oMms?version=3&amp;rel=0&amp;autoplay=1&amp;showinfo=0&amp;start=0&amp;autohide=0')"
    where the red part is the ID of a YouTube video.

    I hope this helps.
    ===
    Arie.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •