Using jquery blockUI
HTML
<div class="controls">
<button class="set-block">BLOCK</button>
<button class="set-un-block">UNBLOCK</button>
<button class="set-block-W-msg">BLOCK w MSG</button>
</div>
<hr/>
<div>
<form id="exampleForm">
<button style="z-index: 70000">
TESTE
</button>
<input type="text"></input>
<select>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
</form>
</div>
<div class="msgTemplate">
<ul>
<li>This</li>
<li>Template</li>
<li>List</li>
<li>Msg</li>
</ul>
</div>
JavaScript
/*!
* jQuery blockUI plugin
* Version 2.50 (04-OCT-2012)
* @requires jQuery v1.3 or later
*
* Examples at: http://malsup.com/jquery/block/
* Copyright (c) 2007-2012 M. Alsup
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
* Thanks to Amir-Hossein Sobhi for some excellent contributions!
*/
;(function() {
"use strict";
function setup($) {
if (/^1\.(0|1|2)/.test($.fn.jquery)) {
/*global alert:true */
alert('blockUI requires jQuery v1.3 or later! You are using v' + $.fn.jquery);
return;
}
$.fn._fadeIn = $.fn.fadeIn;
var noOp = $.noop || function() {};
// this bit is to ensure we don't call setExpression when we shouldn't (with extra muscle to handle
// retarded userAgent strings on Vista)
var msie = /MSIE/.test(navigator.userAgent);
var ie6 = /MSIE 6.0/.test(navigator.userAgent);
var mode = document.documentMode || 0;
// var setExpr = msie && (($.browser.version < 8 && !mode) || mode < 8);
var setExpr = $.isFunction( document.createElement('div').style.setExpression );
// global $ methods for blocking/unblocking the entire page
$.blockUI = function(opts) { install(window, opts); };
$.unblockUI = function(opts) { remove(window, opts); };
// convenience method for quick growl-like notifications (http://www.google.com/search?q=growl)
$.growlUI = function(title, message, timeout, onClose) {
var $m = $('<div class="growlUI"></div>');
if (title) $m.append('<h1>'+title+'</h1>');
if (message) $m.append('<h2>'+message+'</h2>');
if (timeout === undefined) timeout = 3000;
$.blockUI({
message: $m, fadeIn: 700, fadeOut: 1000, centerY: false,
timeout: timeout, showOverlay: false,
onUnblock:...