shake

In this example below you will see how to do a shake with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by jacobtyq, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright jacobtyq ©
  • HTML
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>shake</title>
  
  
  
  
  
</head>

<body>

  <span id="message">Banana</span>
<script type="text/javascript" src="https://cdn.rawgit.com/alexgibson/shake.js/master/shake.js"></script>
<script> 
//listen to shake event
    var shakeEvent = new Shake({threshold: 15});
    shakeEvent.start();
    window.addEventListener('shake', function(){
        alert("Shaked");
var div = document.getElementById('message');

div.innerHTML = div.innerHTML + 'Shaked';
      
    }, false);

    //stop listening
    function stopShake(){
        shakeEvent.stop();
    }

    //check if shake is supported or not.
    if(!("ondevicemotion" in window)){alert("Not Supported");}
</script>
  
  

</body>

</html>

Comments