Adapting embedded video from imdb into a mobile view

Question

I'm trying to embed the IMDB movie trailer iframe into a mobile Ionic app, problem is that apparently their embed code can't go below 400px width, I've set the parameters for the iframe with the width value as provided by the site:

<iframe src="http://www.imdb.com/video/imdb/vi354465561/imdb/embed?autoplay=false&width=320" width="320" height="480" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" frameborder="no" scrolling="no"></iframe>

but all the elements inside their html structure show a fixed width of 400px. If this is a limitation of their page, what recommended alternative can I use to display the trailer correctly over a 320px width viewport? which is what I'm using as default mobile visualisation.

The only workaround I'm applying now is to move the iframe a bit over the container so the fullscreen button is available, but this doesn't look right.

score 1 · Answer 1 · edited May 23 '17 at 10:28

1

The only solution is to change the iframe's CSS and make it responsive to your vieweport, which might be possible. Try what's mentioned here: How to apply CSS to iframe?

Edit: If all fails, seems like the only fallback could be creating a scrollable container over your iframe so that the user can at least view it completely scrolling. You can do this with the CSS Overflow property

edited May 23 '17 at 10:28

Community

1
1

answered Jul 22 '16 at 05:03

sgarcia.dev

4,375
11
33
57

wouldn't the cross-domain restriction forbid me from modifying the content coming from the imdb domain? – Alexander Fradiani Jul 22 '16 at 05:05
On the first answer, yup. Did you check the rest of the answers? (The 2nd one with PHP looked slightly more promising, otherwise just ignore my answer ) – sgarcia.dev Jul 22 '16 at 05:06
Updated answer to at least provide a fallback – sgarcia.dev Jul 22 '16 at 05:08
Yeah that one is giving me some ideas, will need to test if imdb accepts this kind of 'intromission' I would be doing modifying the html structure on my server previously to send it to client. – Alexander Fradiani Jul 22 '16 at 05:09

Adapting embedded video from imdb into a mobile view

1 Answers1