Docs

[Alejandro Jose S]

Hi guys, i recently came accross a bit of a problem, i saw you solved it for somebody else but didn’t post the code (and the page doesn’t exist anymore). i want to do exactly what you did to this guy: https://community.theme.co/forums/topic/embed-video-in-a-background-image/

Could you please tell me how to achieve that? (embed a video withing a background image). i have the image of a tv and i would like to embed my video there so it seems that the video is coming from the tv.

Could you tell me how to do it?

P.S: is it still not doable with a link or iframe to youtube or vimeo? (that’s not much of a problem but it would be really cool if it were an option)

[Alejandro Jose S]

This reply has been marked as private.

[John Ezra]

Hi there,

Thanks for writing in! Your background image is blank? Would you mind checking and getting back to us? Thanks!

[Alejandro Jose S]

Hahaha, the background image is a white tv that’s why it seems like there’s nothing in there, sorry about not telling you about it before, i totally forgot about it.

I suppose it could also be done with something like this: http://s3.gomedia.us/wp-content/uploads/2012/06/TexRep_DisplayMock-986×900.jpg i’d just have to adjust the size to my image. you can try it out with this if you feel it’s more comfortable.

[Paul R]

Hi,

I have created a sample, please change the video.

http://themarkker.com/x-support-test/

Thanks

[Alejandro Jose S]

This reply has been marked as private.

[Alejandro Jose S]

Nevermind, i found a cooler solution (and also responsive) using rev. slider. i have another question though. i can set it up in a way that if clicked once it would play the video and if clicked twice it would pause the video (using rev slider actions).

I’m working on some js to make it work multiple times (whenever it’s clicked it will either pause or play the video) but the only thing i need to find out is the way rev slider uses to make a video play or pause, do you happen to know it?

[Friech]

Hi There,

Sorry, but further customizations from here would be getting into custom development, which is outside the scope of support we can offer. If you need more in depth changes, you may wish to consult with a developer. X is quite extensible with child themes, so there are plenty of possibilities.

Thanks for understanding.

[Alejandro Jose S]

I already did it! i used css instead so, problem solved! here’s the code in case anyone wants to add border-radius to a video:

iframe,
object,
embed{
-webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%); /*ios 7 border-radius-bug */
-webkit-transform: rotate(0.000001deg); /*mac os 10.6 safari 5 border-radius-bug */
-webkit-border-radius: 10px; 
-moz-border-radius: 10px;
border-radius: 10px; 
overflow: hidden; 
}

I put iframe,object and embed because those are the actual html selectors for video but they could work with just an id (#yourid) or a class (.yourclass) =D

this could work with ANY embed or selfhosted video, so that’s that :p

[Joao]

Hi There,

That is great to hear it.

And thanks for sharing your solution with the community.

Joao

[Author]

Posts