Loading image in ajax call in html page added in dynamic crm is not working in chrome

<script src="ajax.googleapis.com/.../jquery.min.js"></script>
<img src="sm_loading.gif" id="loading" style="display:none" />
<input class="custom-btn" id="btnsave" value="Save" onclick="SaveData();"  type="button">
function SaveData() {
	$('#loading').show();
	var stocktrack = {};
	stocktrack.sm_Description = descval;
	var jsonPO = window.JSON.stringify(stocktrack);
	var oDataUri = serverUrl + "/XRMServices/2011/OrganizationData.svc/sm_stocktrackingSet";
	$.ajax({
		type: "POST",
		contentType: "application/json; charset=utf-8",
		datatype: "json",
		url: oDataUri,
		data: jsonPO,
		async: false,
		beforeSend: function (XMLHttpRequest) {
			XMLHttpRequest.setRequestHeader("Accept", "application/json");
		},
		success: function (data, textStatus, XmlHttpRequest) {
			debugger;
			$('#loading').hide();
		},
		error: function (XMLHttpRequest, textStatus, errorThrown) {
			alert(textStatus);
		}
	});
}