Pessoal, tenho uma aplicação onde é utilizada iframes.
E tenho uma função JS que ao ser feita alguma requisição, ela preenche com um loading, só que esse loading está “pegando” uma parte do menu de cima (acima do iframe) e quando traz o resultado (se for uma tabela de resultado) a tela do loading não “cobre” para baixo, permanecendo no tamanho inicial da requisição.
$(function(){
console.log("Carregou Script ");
window.addEventListener("message", receiveMessage, false);
var TimeoutLoading;
var Window;
var frame;
if(document.getElementById("iframe-servicos")) {
frame = document.getElementById("iframe-servicos");
} else {
frame = document.getElementById("centro");
}
if (frame) {
Window = frame.contentWindow;
} else {
Window = window;
}
function receiveMessage(event) {
try {
var returnData = JSON.parse(event.data);
} catch (e) {
console.log("Mensagem inválida");
}
if (returnData) {
if(returnData.message == 'ShowLoading') {
console.log("Show Loading");
var iframe = $("iframe[src*='tela']");
var div = $("<div style='position:absolute;width:calc("+ $(iframe).css("width") +" + 100px);height:calc("+$(iframe).css("height")+" + 50px);background-color:rgba(0,0,0,0.1);' class='loadingBackground'></div>");
//window.scrollTo(0,0);
//$(iframe).hide();
$(div).insertBefore(iframe);
var spinner = loader();
TimeoutLoading = setTimeout(function() {
$(".spinner").remove();
var iframe = $("iframe[src*='tela']");
$(".loadingBackground").remove();
}, returnData.timeout);
} else if(returnData.message == 'HideLoading') {
clearTimeout(TimeoutLoading);
console.log("Hide Loading");
$(".spinner").remove();
var iframe = $("iframe[src*='tela']");
$(".loadingBackground").remove();
//$(iframe).show();
} else if(returnData.message == 'scrollTop') {
window.scrollTo(0,0);
} else if(returnData.message == 'setIframe') {
$(".iframes").css("width","100%");
} else if(returnData.message == 'getClientName') {
var clientName = $(".user-area").find(".infos").find(".name").text();
var newDt = { message: 'gotClientName', clientName: clientName};
Window.postMessage(newDt, '*');
}
}
}
});