JSFiddle - React, Tailwind, and code Playground

by DonamiteIsTNT

HTML

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Click blocker test</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<style>

</style>
<script type="text/javascript">
// JQUERY PLUGIN CODE
(function($) {
    var blocker = $("<div/>", {
            id: "clickBlocker",
            style: 'position:absolute; top:0; left:0; width:100%; height:100%; z-index:100000; display:none; background:url(#);'
        }).click(function(e) {
            e.stopPropagation();
        });
        
    $.fn.blockClicks = $.blockClicks = function() {
        if(arguments[0]===false) {
            blocker.hide();
        } else {
            blocker.show();
        }
        return (typeof this=="function") ? undefined : this;
    }
    
    $(function() {
        $("body").append(blocker);
    });
})(jQuery);

$(document).ready(function() {
    $("#test1").blockClicks().fadeIn(4000, function() { $.blockClicks(false) });
});
</script>
</head>

<body style="font-size:200%">
    <a id="test1" href="http://www.google.com" style="display:none">No clicks during 4 second fade-in</a><br />    
    <a id="" href="http://www.google.com">Click me</a><br />    
    <a id="" href="http://www.google.com">Click me</a><br />    
</body>
</html>