Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Possible to embed a youtube video in an svg?

Sozi is an inkscape extension that allows Prezi-like panning/zooming of an svg file when viewed in an svg-enabled web browser. A youtube video can be embedded in a Prezi, and I'd like to be able to embed a youtube video (or any kind of video) in an svg. I know that html links can be made in svg documents (and inkscape supports this directly). Is there a way to embed a video (via an iframe or video tag?) into an svg?

like image 608
bwv549 Avatar asked May 26 '11 05:05

bwv549


People also ask

Does SVG support video?

Videos can be embedded directly into an SVG by wrapping them in a <foreignObject> element. The example below applies a color filter to the embedded foreignObject element and its children.

Can I put a link in an SVG?

SVG's <a> element is a container, which means you can create a link around text (like in HTML) but also around any shape.

How do you embed a video clip?

On a computer, go to the YouTube video or playlist that you want to embed. From the list of Share options, click Embed. From the box that appears, copy the HTML code. Paste the code into your website HTML.


1 Answers

<foreignObject width="560" height="349">
  <iframe xmlns="http://www.w3.org/1999/xhtml"
    width="560" height="349"
    src="http://www.youtube.com/embed/YOUR-MOVIE-ID"
    frameborder="0"></iframe>
</foreignObject>

That should do the trick. Be careful, that the xmlns attribute stays on the iframe element. foreignObject is explained here.

like image 54
Boldewyn Avatar answered Oct 23 '22 04:10

Boldewyn