JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://malsup.github.io/jquery.blockUI.js"></script>
<a href="http://jsfiddle.net/straeger/gxzbE/" > link </a>
<div id="test" style="width:30px; height:30px;border:solid 1px red;cursor:pointer">test</div>
<div style="display:none;" id="loadingMessage" > 
    <h3>
        <img src="http://nervtag.de/public/img/ajax-loader.gif" width="100" height="100" />In progress
    </h3>
</div>

JavaScript

var rootPath = document.body.getAttribute("data-root");

$.blockUI.defaults.message = $('#loadingMessage');
$(document).ajaxStart($.blockUI).ajaxStop($.unblockUI);
$(window).on('beforeunload', function(){$.blockUI({ message: $('#loadingMessage') });});



$(document).ready(function() {
    $.blockUI({ message: 'F00' }); 
    $('#test').click(function(){ 
        $.ajax();
        //alert(rootPath)
    });
})