JSFiddle - React, Tailwind, and code Playground
by Cone
HTML
<script src="http://malsup.github.com/jquery.blockUI.js"></script>
<input type="button" id="theButton" value="loadIt"/>
<div id="theContainor" class="cent"></div>
CSS
.cent {
height:auto;width:300px;
margin:50px auto;
border:1px solid silver;
padding:5px;
background:#dfdfdf;
}
JavaScript
$(function() {
debugger;
$('input').click(function() {
$('#theContainor').block({
message: '<div class="pre"><img src="http://jimpunk.net/Loading/wp-content/uploads/loading45.gif" width="65px" height="50px"/></div>',
css: { height: '0px'}
});
$('#theContainor').append('<img src="http://www.ptb.de/de/aktuelles/archiv/presseinfos/pi2011/bilder/20110228_thoron_big.jpg?seed=' + Math.random() +'" width="300px" onload="$(\'#theContainor\').unblock();"/>');
});
});