barra de progresso de uploads incondizente

Ola Pessoal tenho uma barra de progresso no meu formulario que funciona por uma função javascript. e quando o imput submit é clicado, ela mostra uma imagem gif em progresso infinito até os arquivos serem upados, no fim aparece a frase de "Enviado com sucesso"

Mas o formulario tem itens obrigatorios e se o usuario clica no botão enviar aparece o aviso de que preencher o endereço é obrigatorio, mas aparece tambem a barra gif. Assim fica algo muito estranho, pois o usuário pensa que esta upando algo já, sendo que ele ainda nem preencheu tudo.

O codigo esta assim: funciona bem mas nao me serve por esta falha que falei:

<script>
	function Mudarestado(el) {
 var display = document.getElementById(el).style.display;
 if(display == "none")
 document.getElementById(el).style.display = 'block';
 else
 document.getElementById(el).style.display = 'none';
	}
</script>

<form method="post" id="formulario" action="php/cadasto.php" enctype="multipart/form-data" name="form">

<div id="oculto" style="display: none;"><img src = "imagens/loading1.gif" width="250px"><br />

Aguarde um instante. . .

</div><br/>

<input type="submit" id="enviar" value="ENVIAR" alt="Enviar agora!" title="Enviar Agora!" onclick="Mudarestado('oculto')">

Eu tentei assim, mais nao deu certo, claro que esta errado porque ainda no iniciando em php, e tinha que tentar algo, mas precisava muito resolver isto, alguem tem uma saída? agradeço muito as respostas

<php

if(isset($_POST['form'])){

echo '<div id="oculto" style="display: none;"><img src = "imagens/loading1.gif" width="250px"><br />

Aguarde um instante. . .

</div><br/>';
}
?>