se logra con un div transparente encima del form, algo asi
Código HTML:
Ver original <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
$(function(){
$('form').submit( function(){
//Agregar un div al principio del form
capa = $('
<div class="capaTransparente">').prependTo(this);
//Le doy opacidad
capa.animate({'opacity': 0.5});
//Alguna operacion ajax
$.get('dos.jsp', function(){
//Cuando termina la solicitud le doy opacidad 0
capa.animate({'opacity': 0}, function(){
//Cuando termina la animacion borro el div
$(this).remove();
})
});
return false;
});
});
form{margin:100px; position:relative; width:250px; height:150px}
.capaTransparente{position:absolute; height:100%; width:100%; background:#ccc; opacity: 0; filter: alpha(opacity=0); -moz-opacity: 0;}
<input id="enviar" type="submit" value="Enviar">
fijate nomas el css que funcione