1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

How to open Media Sites in an Overlay!

Discussion in 'Styling and Customization Questions' started by faeronsayn, Sep 17, 2011.

  1. faeronsayn

    faeronsayn Well-Known Member

    I don't know how this can be done, but I am sure its quite easy to do through bbcode or something.

    All I want is have embedded media sites like youtube, megavideo, dailymotion, and other sites similar to those open in an overlay.

    So they are embedded and they are like a little picture with a play button in the middle, once clicked an overlay opens and darkens the surroundings like what it does when you click on login / signup.

    And then you can play the video.

    Almost exactly like how its done on 8wayrun.

    Here is an example:


    This is very important or at least a must for me, since my site uses a lot of videos, and I don't want them to be "in the way".

    I know this should be quite easy, if anyone can do this, or knows how please let me know.
  2. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

  3. faeronsayn

    faeronsayn Well-Known Member

    I contacted him, and I am sure he is busy so he might not get the time to reply, does anyone else have any ways to make this work ?
  4. faeronsayn

    faeronsayn Well-Known Member

  5. faeronsayn

    faeronsayn Well-Known Member

    After digging around and looking at sources of some pages, I've figured out that the media overlay is actually happening with a plugin, its called xenMedio ... from Jaxel himself, now I just need to replicate it and make it work with my bbcode media sites...

    Here is the xenmedio plugin using the overlay...
    <xen:require css="EWRmedio.css" />
    <div class="medioBBc" {xen:if $float, 'style="float: {$float};"'}>
    <div class="bbCodeBlock bbCodeQuote">
    <div class="attribution type">{$media.media_title}</div>
    <div class="bbCodeMedio" style="background: url('data/media/{$media.media_id}.jpg') no-repeat;">
    [B]<a href="{xen:link 'media/popout', $media}" class="OverlayTrigger">[/B]
    <img src="js/8wayrun/EWRmedio_play.png" />
    and now I need to integrate this somehow so it works with....

    one of my media sites with the following code....

    <iframe src="http://www.putlocker.com/embed/{$id}" width="600" height="360" frameborder="0" scrolling="no"></iframe>
    Instead of using the thumbnail of the video, I am fine with using a pre - made image for the different sites...

    If anyone has an idea on how to implement this, so when user puts a url of maybe putlocker ... or something it shows a play button with maybe the picture of put locker, once clicked on that image it would open up an overlay with the video inside it...

    Please help here :p
  6. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    faeronsayn likes this.

Share This Page