JSFiddle - React, Tailwind, and code Playground
by Victor
CSS
.blip {
width:20px;
height:20px;
display:block;
position:fixed;
background: #333;
left:0;
top:0
}
body {
width:100%;
height:100%;
background: red;
display:block;
}
JavaScript
$('body').click(function (e) { //Default mouse Position
alert(e.pageX + ' , ' + e.pageY);
var parentOffset = $(this).parent().offset();
var clickHorz = e.pageX - parentOffset.left - 5;
var clickVert = e.pageY - parentOffset.top - 5;
$('body').append('<div class="blip">kk</div>');
$('.blip').css({"left": clickHorz + "px", "top": clickVert +"px" });
//$('.log').append(clickHorz +" "+ clickVert +", " +);
});