JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-git.js"></script>
    <script>
        $(document).ready(function () {
            $("#spacerdiv").click(function (clicke) {
                var resultText = "event.pageX: " + clicke.pageX + ", event.pageY: " + clicke.pageY;
                $("#valuep").text(resultText);
            });
        });
    </script>
    <style>
        #spacerdiv {
            width:3000px;
            height:3000px;
            background-color:blue;
        }
        #infodiv
        {
            width:300px;
            position:fixed;
            top:0px;
            right:0px;
            background-color:white;
        }
    </style>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <div id='spacerdiv'></div>
  <div id='infodiv'>
      <p>Click anywhere in the blue area to get event.pageX and event.pageY values:</p>
    <p id="valuep"></p>
    <p><strong>=== Bug Note ===</strong></p>
      <p><a href="http://bugs.jquery.com/ticket/12343">http://bugs.jquery.com/ticket/12343</a></p>
    <p>In Internet Explorer 10 that came with Windows 8 RTM, event.pageX and event.pageY both have incorrect values:</p>
    <p>Instead of returning the mouse position relative to the document's Left/Top, the values returned are relative to the IE10 viewport's Left/Top.</p>
    <p>To reproduce this problem, simply scroll a page half way to the right and half way down, move mouse around and you can see the incorrect values returned. </p>
    <p><strong>NOTE: tested using jQuery 1.7.2 and 1.8.0, both have this problem. Test was done using a HTML5 doctype, didn't test older doctypes.</strong></p>
  </div>
</body>
</html>