Question

I’m trying to add Vimeo embeds with options (colors, etc). However, it seems that Vimeo doesn’t recognize the options if the iframe is created using jQuery or DOM:

var fail = $('<iframe>', {
    src: 'http://player.vimeo.com/video/36825140?title=0&amp;byline=0&amp;portrait=0&amp;color=a4a9ab'
});

But, if I use innerHTML, it works (it also works using plain HTML).

var ok = $('<div>').html('<iframe src="http://player.vimeo.com/video/36825140?title=0&amp;byline=0&amp;portrait=0&amp;color=a4a9ab"></iframe>');

Test fiddle: http://jsfiddle.net/nhkr5/

I would really like to use DOM tools for the task, so I can reference the iframe element and get rid of the extra wrapper.

Is there another “correct” way of doing this?

Answer 1

If you inspect the dynamically created iframe, you will discover that the & entities are not resolved, so you don’t have & in the src, but literal &

http://jsfiddle.net/nhkr5/1/