Deploying an image on the web can be difficult, especially with resolution independence. Opacity helps by giving you the power to export and upload your images to your server with one click. Just add a factory to your image and set its type to Transmit or Fetch. Set up the settings you want, and then just build that factory to get your image on your server.
To use your bitmap image on your web site with resolution independence, you can use the following JavaScript:
var hiRes = (window.devicePixelRatio > 1);
function addImage(source, alt, width, height) {
document.write('<img src="' + source);
if (hiRes)
document.write('Hi');
document.write('.png" alt="' + alt + '" width="' + width + 'px" height="' + height + 'px">');
}
This code will automatically select the high resolution version of your image if the browser's resolution is greater than 1, otherwise it will use the 1x version. You can use this code in your HTML with:
<script type="text/javascript">addImage("images/title","My Title",300,50);</script>
You can also export your image as Source Code to generate code that will dynamically redraw your image's contents. JavaScript Canvas code can be incorporated with the canvas HTML element to add dynamic graphics.