Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 2 Next »

<p><style type="text/css">
.centre{
margin:0 auto;
text-align:center;
}
.left{
text-align:left;
}
table#matrix{
/*border:1px solid #000;
-moz-box-shadow: 3px 3px 5px 6px #ccc;
-webkit-box-shadow: 3px 3px 5px 6px #ccc;
box-shadow: 3px 3px 5px 6px #ccc;*/
border-collapse:collapse;
margin:0 auto;
}

table#matrix tr td{
padding:15px 15px 0 15px;
border-bottom:1px solid #005480;
}
table#matrix tr:nth-child(odd) td{
padding:0 15px 15px 15px;
}
table#matrix tr:nth-child(even) td{
border:none;
vertical-align:bottom;
}
table#matrix tr td div{
margin:0 auto;
}

table#matrix .headingRow td{
min-width:70px;
font-weight:bold;
}
table#matrix tr td p{
font-size:xx-small;
text-align:center;
margin:0;
padding:2px 0 0 0; /* bit of padding to separate dot from text */
}
.circle {
width: 15px;
height: 15px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
border-radius: 50px;
-moz-box-shadow: 0px 0px 15px 1px #ccc;
-webkit-box-shadow: 0px 0px 15px 1px #ccc;
box-shadow: 0px 0px 15x 1px #ccc;
}
.green{
background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, green 0%, green 100%, green 95%);
background-image: -webkit-radial-gradient(45px 45px, circle cover, green, green);
background-image: radial-gradient(45px 45px 45deg, circle cover, green 0%, green 100%, green 95%);
background-color:green;

}
.orange{
background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, yellow 0%, orange 100%, red 95%);
background-image: -webkit-radial-gradient(45px 45px, circle cover, yellow, orange);
background-image: radial-gradient(45px 45px 45deg, circle cover, yellow 0%, orange 100%, red 95%);
background-color:orange;
}
.red{
background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, orange 0%, red 100%, red 95%);
background-image: -webkit-radial-gradient(45px 45px, circle cover, orange, red);
background-image: radial-gradient(45px 45px 45deg, circle cover, orange 0%, red 100%, red 95%);
background-color:red;
}
</style></p>
<h1>Device Compatibility</h1>
<p>There are 3 ways you might access the Blink Mobility Platform: using a Mobile App, Mobile Browser or Desktop Browser. See below for compatibility information for each method.</p>
<p>&nbsp;</p>
<p style="font-weight:bold;">Legend:</p>
<div class="circle green">
<p style="padding-left:30px; width:200px;">Green - Full Support</p>
</div>
<div class="circle orange">
<p style="padding-left:30px; width:200px;">Orange - Partial Support</p>
</div>
<div class="circle red">
<p style="padding-left:30px; width:200px;">Red - No Support</p>
</div>
<table id="matrix" border="0">
<tbody>
<tr>
<td colspan="3" class="centre">
<h1>Mobile App Compatibility</h1>
</td>
</tr>
<tr class="headingRow centre">
<td class="left">Top Features</td>
<td class="centre">IOS Native App</td>
<td class="centre">Android Native App</td>
</tr>
<tr>
<td><!-- Top Features --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>HTML5 / CSS3</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- HTML5 / CSS3 --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>jQuery Mobile</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- jQuery Mobile --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Offline Data Storage</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Offline Data Storage --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Forms</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Forms --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Location Services</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Location Services --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Signature Capture</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Sig Capture --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Camera Access</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Camera Access --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Image Library / File Upload</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Image Lib / File Upload --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Image Annotation</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- IMage Annotation --></td>
<td>
<p>IOS 7+</p>
</td>
<td>
<p>&nbsp;</p>
</td>
</tr>
<tr>
<td>Barcode Scanning</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Barcode Scanning --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<table id="matrix" border="0">
<tbody>
<tr>
<td colspan="7" class="centre">
<h1>Mobile Browser Compatibility</h1>
</td>
</tr>
<tr class="headingRow centre">
<td class="left">Top Features</td>
<td class="centre">Safari</td>
<td class="centre">Chrome</td>
<td>Android Browser</td>
<td>Blackberry Browser</td>
<td>Windows Phone 8 Browser</td>
<td>Opera</td>
</tr>
<tr>
<td><!-- top Features --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>HTML5 / CSS3</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- HTML5 / CSS3 --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>jQuery Mobile</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- jQuery Mobile --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Offline Data Storage</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Offline Data Storage --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Forms</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Forms --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Location Services</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Location Services --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Signature Capture</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Signature Capture --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Camera Access</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Camera Access --></td>
<td>
<p>If supported by device</p>
</td>
<td>
<p>If supported by device</p>
</td>
<td>
<p>If supported by device</p>
</td>
<td>
<p>Partial support</p>
</td>
<td>
<p>If supported by device</p>
</td>
<td>
<p>If supported by device</p>
</td>
</tr>
<tr>
<td>Image Library / File Upload</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Image Lib / File Upload --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Image Annotation</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Image Annotation --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Barcode Scanning</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Barcode Scanning --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<!-- START Desktop Browser Compatibility Table -->
<table id="matrix" border="0">
<tbody>
<tr>
<td colspan="9" class="centre">
<h1>Desktop Browser Compatibility</h1>
</td>
</tr>
<tr class="headingRow centre">
<td class="left">Top Features</td>
<td>Safari</td>
<td>Chrome</td>
<td>Firefox</td>
<td>Opera</td>
<td>IE10,11</td>
<td>IE9</td>
<td>IE8</td>
<td>IE7</td>
</tr>
<tr>
<td><!-- top Features --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>HTML5 / CSS3</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
<td>
<div class="circle orange">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- HTML5 / CSS3 -->
<p style="text-align:left;">As supported by each browser. <br />
Refer to <a href="http://html5test.com/">http://html5test.com/</a></p>
</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>
<p>As supported by browser</p>
<p>&nbsp;</p>
</td>
<td>
<p>As supported by browser</p>
<p>&nbsp;</p>
</td>
<td>
<p>As supported by browser</p>
<p>&nbsp;</p>
</td>
</tr>
<tr>
<td>jQuery Mobile</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!--jQuery Mobile --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Offline Data Storage</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!--Offline Data Storage--></td>
<td>
<p>BICv2</p>
</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Forms</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!--Forms--></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Location Services</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!--Location Services --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Signature Capture</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!--Signature Capture--></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Camera Access</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!--Camera Access--></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Image Library / File Upload</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
<td>
<div class="circle green">&nbsp;</div>
</td>
</tr>
<tr>
<td><!--Image Lib / File Upload--></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Image Annotation</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!--Image Annotation--></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Barcode Scanning</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
<td>
<div class="circle red">&nbsp;</div>
</td>
</tr>
<tr>
<td><!-- Barcode Scanning --></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>

  • No labels