regarding Overlay

I created UI like this

config = {
	  isolate : true,
	  container: "a",
	  borderless:true,
	  type:"line", padding:8,
	  id:"layout",
	   rows:[ {		                       	                              		 		                           		                            		                               
	        	 id:"bid",
	        	 view:"accordion",
	        	 cols:[{	
	        	 body:{
	        	 rows: [{ 												
				 },priceDatatable
				 ]}						
			}]		                           		                        
		 },
		 { }]								             
	 };	 	   
webix.extend($$("layout"), webix.ProgressBar);

where priceDatatable is Datatabale.now here I am Using overlay like this…

$$("layout").disable();
        $$("layout").showProgress({
            type:"top",
            delay:delay,
            hide:true
        });

i tried with these Id ‘layout, bid’
but it is showing object does not support method showProgress , can you suggest me , how I can use overlay Here.

The same works for me

http://webix.com/snippet/c3cebc34

this will support all browser (mean IE all version). because I am using IE-9

i tried this one ( http://webix.com/snippet/c3cebc34) its working , but for me its showing like that .( Unable to get value of the property ‘showOverlay’: object is null or undefined ),
will you suggest , what I am missing here ? ?
Thank you maksim

Technically it works, but IE8-IE9 do not support css animation so this kind of progress bar has not animation.

will you please suggest any other option that will work for IE-9 ?

Sorry, but it seems we don’t have any working animation, that will look nicely in IE9.
While progressbar component technically works, CSS animations are not supported in IE9, so progress is never animated.

We will include update in Webix 2.4, so this version will show animated progress bar in IE9