Loader pendant le chargement de la page

cid5420
Javascript

Bonjour,

J'aimerais effectuer un loader pendant le chargement de mes pages. Donc dans mon template, j'ai mit une div qui contient un loader css.

En js, j'ai fait une fonction. Ca fonctionne presque ! en faite le loader démarre presque à la fin du chargement de ma page donc ma div apparait et disparait presque immediatement.
Alors que j'aimerais afficher ma div dès que je clique sur un lien de menu.

<div class="loader" id="loader-modal">
  <div class="loader-dialog">
    <div class="loading"><h1><span class="load load-bars"><span></span></span> Chargement...</h1></div>
  </div>
</div>
function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            if (oldonload) {
                oldonload();
            }
            func();
        }
    }
}
addLoadEvent(function() {
    $('#loader-modal').fadeOut('1000');
});

2 réponses

dycom

Salut essaye de voir du coté de jquery et un genre de code comme ça au lancement d'une page: 

$(document).ready(function() {
        $('#container_principal').hide();
        $(window).load(function() {
                $(".loader_container").fadeOut(1500);
                $('#container_principal').show();
        }
}

En espérant t'avoir aidé, bye ;)

cid5420
Auteur

Ok merci je vais tester ! En attendant j'ai résolu le problème en appelant la fonction au clique sur un lien de menu ou bouton. Un peut fastidieu de reprendre tout les liens et boutons :/