JSFiddle - React, Tailwind, and code Playground

HTML

<div id='displayDiv'></div>

<iframe id="testiFrame" style='height:400px; width:600px; 
-webkit-transform:matrix(0.5, 0, 0, 0.5, 0, 0); -webkit-transform-origin:0px 0px;
-ms-transform:matrix(0.5, 0, 0, 0.5, 0, 0); -ms-transform-origin:0px 0px;'>

</iframe>

JavaScript

var displayDiv = $('#displayDiv');

$('#testiFrame').contents().find('body').append('<div id="blueDiv" style="height:200%; width=100%; background-color:blue"></div>');

$('#testiFrame').contents().find('#blueDiv').click(function(e){displayDiv.text('x:'+e.pageX+';y:'+e.pageY);});