Rotating picture

How to embed this 3D picture into iframe at your page

In examples below the iframe is surrounded by 5px orange dotted line using css outline property.

Method 1: Define the size of the iframe as you wish. The content inside will be fitted as well as possible. Usually there will be some margin in either vertical or horizontal direction

Code:

<iframe src="//pix10.pixmoor.net/dx0eb3b01c88acbc/bg_0/embed.html" frameborder="0" scrolling="no" style="width:55vw; height:30vh;"></iframe>

Result:

Method 2: Using javascript,define the iframe size on one direction and calculate te other based on content. Dimension information can be found on embed.js at the 3D picture webdir.

A helper/example function is provided and used in the example below. At the moment the function supports only pixels as unit. Define size in one direction and set the other to zero.

Code to load the function. Once in document <head> section:

<script type="text/javascript" src="/assets/o2vr/appendiframe.js"></script>

Code:

<script type = "text/javascript" src='//pix10.pixmoor.net/dx0eb3b01c88acbc/bg_0/embed.js'></script>
<script type = "text/javascript">
    var w = 700;
    var h = 0;
    var u = baseurl;
    appendIframe(u,w,h);
</script>

Result: