Afficher un message au chargement de la page

Résolu/Fermé

or3li3n Messages postés 193 Date d'inscription jeudi 3 septembre 2009 Statut Membre Dernière intervention 22 juin 2011 - Modifié par or3li3n le 23/05/2011 à 16:42
or3li3n Messages postés 193 Date d'inscription jeudi 3 septembre 2009 Statut Membre Dernière intervention 22 juin 2011 - 24 mai 2011 à 10:20

Bonjour,

Désolé de poster un message sur forum dont j'ai déjà la solution mais cette solution pourra en intéresser plus d'un.

Je souhaitais afficher un message d'attente (à l'aide de JavaScript) lors du chargement d'une page.

Après quelques essais, voici le résultat:

<script type="text/javascript" >

$('body').css("margin-top","-1000000px");
$('body').prepend("<div id='wait' style='position:absolute;width:220px;top:40%;left:40%;text-align:center;font-weight:bold;' >Chargement en cours . . .<br/><img src='./img/chargement.gif' ></img></div>");

function body_ready(){$('body').css('margin-top','');$('#wait').css('display','none');}
$(document).ready(function(){body_ready();});

</script>

EXPLICATIONS:

Le <body> sera envoyé à 1000000px vers le haut (permettant de le rendre non visible)
On y ajoute un <div> qui sera affiché à la place de votre <body>.
Une fois votre page chargée complétement,le <div> disparait pour laisser place à votre page.

De plus ce code ne demande aucune modification dans votre page,juste l'ajout de ce bout code de JavaScript JUSTE APRES LA BALISE <BODY>.

EXEMPLE:

<body>

<script type="text/javascript" >

$('body').css("margin-top","-1000000px");
$('body').prepend("<div id='wait' style='position:absolute;width:220px;top:40%;left:40%;text-align:center;font-weight:bold;' >Chargement en cours . . .<br/><img src='./img/chargement.gif' ></img></div>");

function body_ready(){$('body').css('margin-top','');$('#wait').css('display','none');}
$(document).ready(function(){body_ready();});

</script>

"LE RESTE DE VOTRE CODE"

Google is our Friend !

A voir également:

Afficher un message au chargement de la page
Message - Guide
Comment recuperer un message supprimé sur whatsapp - Guide
Supprimer une page word - Guide
Message d'absence thunderbird - Guide
Epingler un message whatsapp - Accueil - Messagerie instantanée

1 réponse

Réponse 1 / 1

or3li3n Messages postés 193 Date d'inscription jeudi 3 septembre 2009 Statut Membre Dernière intervention 22 juin 2011 6
24 mai 2011 à 10:20

RÉSOLU !

Discussions similaires

qu'est-ce que diff message ?