JSFiddle - React, Tailwind, and code Playground
by johannpickard
HTML
<!DOCTYPE html>
<html>
<head>
<style>
</style>
<script src="/scripts/snippet-javascript-console.min.js?v=1"></script>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="follower"></div>
<script type="text/javascript">
$(document).on('mousemove', (event) => {
$('.follower').css({
left: event.clientX,
top: event.clientY,
});
});
</script>
</body>
</html>
CSS
.follower {
width: 10px;
height: 20px;
background-color: grey;
border-radius: 20px;
transition-duration: 7s;
transition-timing-function: ease-out;
position: fixed;
transform: translateX(-50%) translateY(-50%);
}