JSFiddle - React, Tailwind, and code Playground

by Irakli Gozalishvili

HTML

<script src="https://raw.github.com/Gozala/teleport/experimental/npm-1.x.x/teleport.js"></script>
<span id="x"></span>
<span id="y"></span>

CSS

head, body { 
    height: 100%;
    width: 100%;
}

#x, #y {
    position: absolute;
}

JavaScript

define('main', function(require, exports, module) {
  var streamer = require('https!raw.github.com/Gozala/streamer/master/streamer.js')
  
    function mousemove(next, stop) {
       document.addEventListener("mousemove", next, false);
    }
    
    var axis = streamer.map(mousemove, function(element) {
        return [ element.clientX, element.clientY ]
    })
    
    axis(function(position) {
       var x = document.getElementById('x')
       var y = document.getElementById('y')
       x.innerHTML = position[0]
       y.innerHTML = position[1]
       x.style.left = position[0] + 'px'
       y.style.top = position[1] + 'px'
    })
    
})
require.main('main')