• Currently supports iPhone 6.
• 3 different perspectives - front, left, and right facing.
• Choose from the black, white, and gold versions.
• Easy jQuery-like initialization.
• Scrollbars modified for webkit to resemble track and thumb of iPhone 6
• Coded in vanilla Javascript, no library dependencies

Place the script and images on your server.

Include the script.

<script type="text/javascript" src="biomp.js"></script>

Create a div element, which will contain the preview.

<div id="preview"></div>

Initialize a new bioMp object using the div.

Vanilla JavaScript

bioMp(document.getElementById('preview'));

jQuery

bioMp($('#preview'));

You must include options such as an image and viewing perspective for the preview to show correctly. This is shown in the next section.

All options must be added to the init function as an object.

For example, to create a left facing preview for http://beeker.io on the gold iPhone, you would initiate the preview div in the usage example with these options.

bioMp(document.getElementById('preview'), {
    url: 'http://beeker.io',
    view: 'left',
    image: 'images/iphone6_side_left_gold.png'
});

Thank you to JustD for the images of the iPhone 6. You can find his work here on Behanced.

MIT license, feel free to use however you wish!

Created by beeker.io