diff --git a/css/crayons.css b/css/crayons.css
index 1dfd170..44782f0 100644
--- a/css/crayons.css
+++ b/css/crayons.css
@@ -2,7 +2,7 @@
 .crayon-icones em {display:none;}
 
 .crayon-boutons,
-.crayon-searching { float: right;padding:0;text-align: right;}
+.crayon-searching { float: right;padding:0;text-align: right;z-index: 3}
 .crayon-boutons button { border:1px solid; cursor: pointer;display:inline-block; padding:0.25rem 0.4rem;}
 .crayon-boutons .crayon-submit { background: #e6efc2 url(images/crayon-ok.svg) 0.15rem center no-repeat; background-size:1.3rem; color: #264409; border-color: #c6d880;float:right;margin-bottom: 0.5rem;margin-left:0.5rem;padding-left:1.5rem;}
 .crayon-boutons .crayon-cancel { background: #fbe3e4 url(images/crayon-cancel.svg) center center no-repeat; background-size:1.3rem;color: #8a1f11; border-color: #fbc2c4;width: 2.5rem; text-indent: -3000em;}
@@ -13,7 +13,7 @@
 .small .crayon-boutons .crayon-cancel {float:left;}
 
 .crayon-init { position: relative; }
-.crayon-init .crayon-icones {display: none;float:right;text-align: right; position: relative; top:0; left:0;width:1.5em;max-width:2rem;;min-width:1rem;height:0;cursor: pointer;z-index:4999;}
+.crayon-init .crayon-icones {display: none;float:right;text-align: right; position: relative; top:0; left:0;width:1.5em;max-width:2rem;min-width:1rem;height:0;z-index:4999;}
 .crayon-icones>span {position: absolute;top:0;right: 0;left: auto;width: 100%;height: 0;padding-bottom: 100%;}
 .crayon-icones>em { position:absolute; left:0; }
 
@@ -23,6 +23,10 @@
 .crayon-changed.crayon-hover em.crayon-img-changed {background-color:#fff; filter:grayscale(100%)}
 .crayon-changed.crayon-hover em.crayon-crayon {z-index:2;background-color: rgba(255,255,255,0.5);}
 
+.crayon-loading .crayon-icones, .crayon-loading .crayon-icones span,.crayon-loading .crayon-icones em.crayon-searching {display: block !important;}
+.crayon-loading .crayon-icones em.crayon-crayon {display: none !important;}
+
+
 em.crayon-edit,
 em.crayon-crayon,
 em.crayon-img-changed { cursor: pointer; border:0; }
@@ -32,13 +36,13 @@ em.crayon-img-changed { cursor: pointer; border:0; }
 .crayon-icones .crayon-img-changed,
 .crayon-icones .crayon-searching,
 .crayon-icones .crayon-edit { position:absolute;left:0;top:0;width: 100%; height:100%; border-radius: 25%; border:1px solid #ddd; background-size: 90% !important;}
-.crayon-icones .crayon-crayon {background: #fff url(images/crayon.svg) no-repeat center;}
+.crayon-icones .crayon-crayon {background: #fff url(images/crayon.svg) no-repeat center;cursor: pointer;}
 .crayon-icones .crayon-img-changed {background: transparent url(images/crayon-changed.svg) no-repeat center;border:0;}
 
-/* TODO ?*/
-.crayon-icones em.crayon-searching { background: url(images/searching.gif) no-repeat; /*height: 13px; width: 13px;*/ }
-/* deprecated? */
-.crayon-icones em.crayon-edit { background: url(images/edit.png) no-repeat; /*height: 20px; width: 20px; */}
+.crayon-icones em.crayon-searching { background: url(images/searching.gif) no-repeat; border-color:transparent }
+
+/* deprecated? je ne trouve aucun bout de code js qui pose crayon-edit */
+.crayon-icones em.crayon-edit { background: url(images/edit.png) no-repeat;}
 
 .formulaire_crayon .crayon-active { font: inherit; display:block;border: 1px solid #ddd;padding:0.25em;}
 
@@ -51,21 +55,27 @@ em.crayon-img-changed { cursor: pointer; border:0; }
 .crayon-html .crayon-boutons { position:absolute; right:0; }
 .crayon-html .small .crayon-boutons {position: relative;}
 
+.crayon.crayon-loading { opacity: 0.7;text-shadow: 0 0 50px red;filter:grayscale(50%);}
+.crayon-html.crayon-loading {filter:grayscale(70%) blur(3px);}
 
 .crayon-invalide { display: block; background-color: #ff8888; border: 1px dashed #ff0000; }
 .crayon-invalide p { margin:0; padding: 1%; font-style: italic; font-size: 80%; }
 /* resizer */
-.resizehandle { background:transparent url("images/resizer.svg") center no-repeat;background-size: contain; cursor:ns-resize; font-size:0.1em; width: auto !important;margin-right: 150px;opacity: 0.5;}
+.resizehandle { background:transparent url("images/resizer.svg") center no-repeat;background-size: contain; cursor:ns-resize; font-size:0.1em; width: auto !important;margin-right: 10rem;opacity: 0.5;}
 .small .resizehandle {margin-right: 0;}
 .resizehandle_boutons { margin-top: -16px; }
 
 
-.crayon-fade.crayon-hover{
+.crayon-fade.crayon-hover:not(.crayon-loading){
 	-webkit-animation-name: crayon-fade-highlight;
 	-webkit-animation-duration: 1s;
 	animation-name: crayon-fade-highlight;
   animation-duration: 1s;
 }
+.crayon-fade.crayon-hover.crayon-loading{
+	-webkit-animation-name:none;
+	animation-name:none;
+}
 @-webkit-keyframes crayon-fade-highlight {
     0%   {background-color: initial;}
     50%  {background-color: #FFFFB4;}
diff --git a/js/crayons.js b/js/crayons.js
index 3241d0d..3cef7ef 100644
--- a/js/crayons.js
+++ b/js/crayons.js
@@ -85,13 +85,14 @@ $.fn.opencrayon = function(evt, percent) {
 	}
 	return this
 	.each(function(){
+		var $me = $(this);
 		// verifier que je suis un crayon
-		if (!$(this).is('.crayon'))
+		if (!$me.is('.crayon'))
 			return;
 
 		// voir si je dispose deja du crayon comme voisin
-		if ($(this).is('.crayon-has')) {
-			$(this)
+		if ($me.is('.crayon-has')) {
+			$me
 			.css('visibility','hidden')
 			.crayon()
 				.show();
@@ -99,37 +100,39 @@ $.fn.opencrayon = function(evt, percent) {
 		// sinon charger le formulaire
 		else {
 			// sauf si je suis deja en train de le charger (lock)
-			if ($(this).find("em.crayon-searching").length) {
+			if ($me.is('.crayon-loading')) {
 				return;
 			}
-			$(this)
-			.find('>span.crayon-icones span')
-			.append(configCrayons.mkimg('searching')); // icone d'attente
+			$me
+				.addClass('crayon-loading')
+				.find('>span.crayon-icones span')
+				.append(configCrayons.mkimg('searching')); // icone d'attente
 			var me=this;
-			var offset = $(this).offset();
+			var offset = $me.offset();
+			var bgcolor = $me.css('backgroundColor');
 			var params = {
 				'top': offset.top,
 				'left': offset.left,
-				'w': $(this).width(),
-				'h': $(this).height(),
+				'w': $me.width(),
+				'h': $me.height(),
 				'ww': (window.innerWidth ? window.innerWidth : (document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.offsetWidth)),
 				'wh': (window.innerHeight ? window.innerHeight : (document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.offsetHeight)),
-				'em': $(this).css('fontSize'), // Bug de jquery resolu : http://bugs.jquery.com/ticket/760
-				'class': me.className,
-				'color': $(this).css('color'),
-				'font-size': $(this).css('fontSize'),
-				'font-family': $(this).css('fontFamily'),
-				'font-weight': $(this).css('fontWeight'),
-				'line-height': $(this).css('lineHeight'),
-				'min-height': $(this).css('lineHeight'),
-				'text-align': $(this).css('textAlign'),
-				'background-color': $(this).css('backgroundColor'),
+				'em': $me.css('fontSize'), // Bug de jquery resolu : http://bugs.jquery.com/ticket/760
+				'class': this.className,
+				'color': $me.css('color'),
+				'font-size': $me.css('fontSize'),
+				'font-family': $me.css('fontFamily'),
+				'font-weight': $me.css('fontWeight'),
+				'line-height': $me.css('lineHeight'),
+				'min-height': $me.css('lineHeight'),
+				'text-align': $me.css('textAlign'),
+				'background-color': $me.css('backgroundColor'),
 				'self': configCrayons.self
 			};
-			if (me.type) params.type = me.type;
+			if (this.type) params.type = this.type;
 			if (params['background-color'] == 'transparent'
 			|| params['background-color'] == 'rgba(0, 0, 0, 0)') {
-				$(me).parents()
+				$me.parents()
 				.each(function(){
 					var bg = $(this).css('backgroundColor');
 					if (bg != 'transparent'
@@ -146,8 +149,9 @@ $.fn.opencrayon = function(evt, percent) {
 					} catch(e) {
 						c = {'$erreur': 'erreur de communication :' + '  ' + e.message, '$html':''};
 					}
-					$(me)
-					.find("em.crayon-searching")
+					$me
+						.removeClass('crayon-loading')
+						.find("em.crayon-searching")
 						.remove();
 					if (c.$erreur) {
 						uniAlert(c.$erreur);
@@ -156,12 +160,12 @@ $.fn.opencrayon = function(evt, percent) {
 					id_crayon++;
 
 					var position = 'absolute';
-					$(me).parents().each(function(){
+					$me.parents().each(function(){
 						if($(this).css("position") == "fixed")
 							position = 'fixed';
 					});
 
-					$(me)
+					$me
 					.css('visibility','hidden')
 					.addClass('crayon-has')
 					.find('>.crayon-icones')
@@ -169,9 +173,9 @@ $.fn.opencrayon = function(evt, percent) {
 					// Detection IE sur sa capacite a gerer zoom :
 					// http://www.sitepoint.com/detect-css3-property-browser-support/
 					if (document.createElement("detect").style.zoom === "") {
-						$(me).css({'zoom':1});
+						$me.css({'zoom':1});
 					}
-					var pos = $(me).offset();
+					var pos = $me.offset();
 					$('<div class="crayon-html" id="crayon_'+id_crayon+'"></div>')
 					.css({
 						'position':position,
@@ -180,7 +184,7 @@ $.fn.opencrayon = function(evt, percent) {
 					})
 					.appendTo('body')
 					.html(c.$html);
-					$(me)
+					$me
 					.activatecrayon(percent);
 					// Si le crayon a une taille mini qui le fait deborder
 					// a droite de l'ecran, recadrer vers la gauche
@@ -265,7 +269,8 @@ $.fn.activatecrayon = function(percent) {
 					}
 				}
 				me
-				.find("em.crayon-searching")
+					.removeClass('crayon-loading')
+					.find("em.crayon-searching")
 					.remove();
 
 				//Remise a zero des warnings invalides (unwrap)
@@ -317,6 +322,7 @@ $.fn.activatecrayon = function(percent) {
 						.find(".crayon-boutons,.resizehandle")
 							.show()
 						.end()
+						.removeClass('crayon-loading')
 						.find('.crayon-searching')
 							.remove();
 						return false;
@@ -347,8 +353,8 @@ $.fn.activatecrayon = function(percent) {
 			.bind('form-submit-validate',function(form,a, e, options, veto){
 				if(!veto.veto)
 				crayon
+				.addClass('crayon-loading')
 				.find('form')
-					.css('opacity', 0.5)
 					.after(configCrayons.mkimg('searching')) // icone d'attente
 					.find(".crayon-boutons,.resizehandle")
 						.hide();