Ajax Loading Image can not work in Chrome and IE

[round]

I do not get Ajax Loading Image in Chrome and IE.
I am getting this image with Firefox only.
Can anyone help me to solve this ?
My Code is as below.

Its not a css problem, My "loading" block do not get display "block" i checked through inspecting Element.

Thanks for any help.


<script>
function FillInBox(val,id){
$('#loading').show();
$("#DisplayTemplates").hide(); // Hide Templates
$("#DisplayImage").hide();
$("#DisplayTemplates").hide();
$("#DisplayDocument").hide();
$("#DisplaySectionCover").hide();
$("#DisplayResume").hide();

//Function to Get Proposal Data i.e Name,Desc,ID Using Ajax Call.
var datastring=val;
$.ajax({
url: "?page=ajax_subservices&action=view,
type:"POST",
async: false,
data:'',
success: function(data)
{
$('#loading').hide();
CKEDITOR.instances['event_description'].setData(data);
}
});
}
</script>

<div style="display:none;" id="loading"><img id="loadingImg" alt="Loading..." src="images/loading.gif" style="position:absolute;margin: 20px 0 0 500px;"></div>
<div class="editsubsection" onclick="FillInBox('val1','val2')"></div>

[round]

It doesn't work even i changed "$('#loading').show();" to "document.getElementById('loading').style.display= "block";"
I also tried with changing ID of my div still no results with chrome and IE.

No body having the idea about it.!!

[jscheuer1]

Since the code apparently isn't executing, we would need to see a demo. As you say, it's not the css. It might be and you might just be missing something, like the image might be there somewhere, just not in a spot where it can be seen. The DOM inspector you're using might need to be refreshed before the display: block; style will be see on the loading div. IE's can do this using its developer tools refresh button in HTML view and in fact needs that to be done in order to show changes in the DOM and styles, Chrome usually updates automatically in its developer tools Elements tab view with changes to the DOM and/or an element's style, but there can be exceptions, and has no way I know of to refresh the DOM view of that tab if there is a problem seeing changes. If it is css, the div might need a width and/or height equal to those of the image, perhaps with size of the image's margins added as well to the div's width and/or height, where they increase those dimensions of the image. And the div might need to be position: relative; and might need a higher z-index than the editsubsection div if that div is positioned.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.