Search code examples
htmlcsswordpressembedding

optimise embedded link so useable across all browsers and web hosting platforms

I've created an embedded link - containing my web app - so that people can paste it in-between the body tags of their HTML. Here's the embedded link:

<iframe src="http://insitu-app.com/index-tennis.html" style="position: absolute; height: 100%; width: 100%; border: none"></iframe>

and here's an example result of it working:

http://insitu-app.com/examples/INsitu-embed-iframe.html

It works on Chrome, but the sliders and 3D models are missing on Internet Explorer and firefox. Furthermore, there are scrollbars present (which i do not want to be there ) that are not present in the original:

http://insitu-app.com/index-tennis.html

Lastly copying and pasting the embedded link into WYSIWYG platforms such as Wordpress doesn't work either - do i need to create a plugin for this?

Any help would be greatly appreciated. Thanks

Solution

  • Try adding top: 0 and left: 0 to your iframe:

    <iframe src="http://insitu-app.com/index-tennis.html" style="position: absolute; height: 100%; width: 100%; border: none; top: 0; left: 0;"></iframe>

    This will remove the scrollbars