First thing first. A demo. Executed with this configuration :
<script src="./dist/thumbstick.min.js"></script>
<script>
var dynamic = thumbstick.create({
zone: document.getElementById('dynamic'),
color: 'blue'
});
</script>
<script src="./dist/thumbstick.min.js"></script>
<script>
var semi = thumbstick.create({
zone: document.getElementById('semi'),
mode: 'semi',
catchDistance: 150,
color: 'white'
});
</script>
<script src="./dist/thumbstick.min.js"></script>
<script>
var static = thumbstick.create({
zone: document.getElementById('static'),
mode: 'static',
position: {left: '50%', top: '50%'},
color: 'red'
});
</script>
Choose the mode you want to test.