"Untitled"
Bootstrap 3.0.0 Snippet by msurguy

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <p id="isAvailable"></p> <p>Tilting and rotating your laptop or device will transform the following image if Device Orientation is available.</p> <img src="http://placehold.it/200x100" alt="The HTML5 logo" id="orientee" />
#orientee { width: 256px; display: block; margin: 0 auto; -webkit-perspective: 300; perspective: 300; }
'use strict'; var logoElement = document.getElementById('orientee'); function handleDeviceOrientation(e) { var transform = 'rotate(' + e.gamma + 'deg) rotate3d(1, 0, 0, ' + e.beta + 'deg)'; logoElement.style.webkitTransform = transform; logoElement.style.transform = transform; } if (window.DeviceOrientationEvent) { window.ondeviceorientation = handleDeviceOrientation; } else { document.querySelector('p#isAvailable').innerHTML = 'Device Orientation is not available.'; }

Related: See More

Template

Full Calendar

Calendar Snippet

Questions / Comments: