Activer les liens d'une page à la fin
Fermé
thom.b
Messages postés
3
Date d'inscription
mardi 3 juillet 2007
Statut
Membre
Dernière intervention
3 juillet 2007
-
3 juil. 2007 à 11:44
thom.b Messages postés 3 Date d'inscription mardi 3 juillet 2007 Statut Membre Dernière intervention 3 juillet 2007 - 3 juil. 2007 à 15:03
thom.b Messages postés 3 Date d'inscription mardi 3 juillet 2007 Statut Membre Dernière intervention 3 juillet 2007 - 3 juil. 2007 à 15:03
A voir également:
- Activer les liens d'une page à la fin
- Supprimer une page word - Guide
- Traduire une page web - Guide
- Créer une page facebook - Guide
- Comment activer windows 10 - Guide
- Page d'accueil iphone - Guide
5 réponses
Reivax962
Messages postés
3671
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
11 février 2021
1 011
3 juil. 2007 à 15:00
3 juil. 2007 à 15:00
Bon, si tu veux pouvoir te rendre compte de la solution que je te propose sans devoir tout modifier, en voilà une petite idée :
Crée un fichier texte, sur ton bureau, que tu appelles page1.html
A l'intérieur, copie-colle le code suivant :
Fais de même avec un page2.html :
En gros, c'est ce que je t'ai donné plus haut, avec quelques adaptation pour les besoins de la démonstration (notamment un timeout qui permet de rallonger artificiellement le temps de traitement)
Tu peux essayer de modifier les paramètres de style pour le rendre plus joli :) notamment jouer sur les couleurs de fond et le degré de transparence...
Crée un fichier texte, sur ton bureau, que tu appelles page1.html
A l'intérieur, copie-colle le code suivant :
<html>
<body>
<script language="javascript">
function do_link()
{
var charge_bkg = document.getElementById("charge_bkg");
var charge_mess = document.getElementById("charge_mess");
charge_bkg.style.display="";
charge_mess.style.display="";
window.setTimeout("temporise()", 3000)
}
function temporise()
{
document.location.href="page2.html";
}
</script>
<div id="charge_bkg" style="position:absolute; width:100%; height:100%; background-color:#000; z-index:10; display: none; opacity: 0.5"></div>
<div id="charge_mess" style="position:absolute; padding:15px; background-color:#fff; z-index:11; display: none; top: 300px; left: 300px; border:5px solid black; font-size:15pt">Chargement...</div>
<a href="javascript:do_link()">page2</a>
</body>
</html>
Fais de même avec un page2.html :
<html>
<body onload="masque()">
<script language="javascript">
function masque()
{
window.setTimeout(temporise(), 3000)
}
function temporise()
{
var charge_bkg = document.getElementById("charge_bkg");
var charge_mess = document.getElementById("charge_mess");
charge_bkg.style.display="none";
charge_mess.style.display="none";
return true;
}
</script>
<div id="charge_bkg" style="position:absolute; width:100%; height:100%; background-color:#000; z-index:10; opacity: 0.5"></div>
<div id="charge_mess" style="position:absolute; width:150px; height:75px; background-color:#fff; z-index:11; top: 30%; width: 30%;">Chargement...</div>
<h1>Ceci est la page 2</h1>
</body>
</html>
En gros, c'est ce que je t'ai donné plus haut, avec quelques adaptation pour les besoins de la démonstration (notamment un timeout qui permet de rallonger artificiellement le temps de traitement)
Tu peux essayer de modifier les paramètres de style pour le rendre plus joli :) notamment jouer sur les couleurs de fond et le degré de transparence...
thom.b
Messages postés
3
Date d'inscription
mardi 3 juillet 2007
Statut
Membre
Dernière intervention
3 juillet 2007
1
3 juil. 2007 à 15:03
3 juil. 2007 à 15:03
Wouaou, merci pour cette réponse super complète !
Je suis presque sûr que ça va résoudre mon soucis !
Je vais essayer ces 2 méthodes, et je reviendrai dire ce que ça a donné.
Pour le javascript, ça ne devrait pas poser de problème puisque le site en contient déjà un.
Bon, je m'y met, et je te tiens au courant !
Merci encore à vous 2 pour votre intérêt et votre aide !
Je suis presque sûr que ça va résoudre mon soucis !
Je vais essayer ces 2 méthodes, et je reviendrai dire ce que ça a donné.
Pour le javascript, ça ne devrait pas poser de problème puisque le site en contient déjà un.
Bon, je m'y met, et je te tiens au courant !
Merci encore à vous 2 pour votre intérêt et votre aide !
bezourox
Messages postés
729
Date d'inscription
vendredi 30 mars 2007
Statut
Membre
Dernière intervention
19 janvier 2013
143
3 juil. 2007 à 11:49
3 juil. 2007 à 11:49
Salut .
Si tu veux que l'on puisse cliquer sur les liens seulement lorsque la page est chargée, j'en déduit que la page est longue à se charger .
J'aurai en premier lieu regardé la taille des pages et voir si il n'est pas possible de les alléger un peu .
Cela aurait une répercution sur le temps d'affichage de ta page et tu n'aurais plus le soucis actuel .
Si tu veux que l'on puisse cliquer sur les liens seulement lorsque la page est chargée, j'en déduit que la page est longue à se charger .
J'aurai en premier lieu regardé la taille des pages et voir si il n'est pas possible de les alléger un peu .
Cela aurait une répercution sur le temps d'affichage de ta page et tu n'aurais plus le soucis actuel .
thom.b
Messages postés
3
Date d'inscription
mardi 3 juillet 2007
Statut
Membre
Dernière intervention
3 juillet 2007
1
3 juil. 2007 à 14:10
3 juil. 2007 à 14:10
Salut, merci pour cette réponse.
La page est effectivement longue à se charger, mais ceci est du non pas à son poids, mais à la communication avec le micro-processeur.
Je vais tout de même voir si je peux alléger les images qui sont présentes. Mais je ne suis pas sûr de réduire beaucoup.
J'ai 25 images ".gif" de 1ko ou 2ko, et 3 ".jpg" de 3ko, 8ko et 16ko.
Mais si quelqu'un à une solution à me proposer pour activer les liens en dernier, je suis toujours preneur !
Sinon, je viens de voir qu'on pouvait interdire le clic droit de la souris avec un jascript.
Je vais essayer de trouver comment interdire le clic gauche. Si c'est possible bien sûr...
Il suffirai de le ré-autoriser une fois tout affiché...
Qu'est-ce que vous en pensez ?
rappel : je suis un super-débutant html, si je dis n'importe quoi, n'hésitez pas à me le dire...
La page est effectivement longue à se charger, mais ceci est du non pas à son poids, mais à la communication avec le micro-processeur.
Je vais tout de même voir si je peux alléger les images qui sont présentes. Mais je ne suis pas sûr de réduire beaucoup.
J'ai 25 images ".gif" de 1ko ou 2ko, et 3 ".jpg" de 3ko, 8ko et 16ko.
Mais si quelqu'un à une solution à me proposer pour activer les liens en dernier, je suis toujours preneur !
Sinon, je viens de voir qu'on pouvait interdire le clic droit de la souris avec un jascript.
Je vais essayer de trouver comment interdire le clic gauche. Si c'est possible bien sûr...
Il suffirai de le ré-autoriser une fois tout affiché...
Qu'est-ce que vous en pensez ?
rappel : je suis un super-débutant html, si je dis n'importe quoi, n'hésitez pas à me le dire...
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Reivax962
Messages postés
3671
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
11 février 2021
1 011
3 juil. 2007 à 14:56
3 juil. 2007 à 14:56
Bonjour,
Il existe des solutions pour résoudre ton problème. Par contre, je ne suis pas sûr qu'il y en ait qui ne fassent pas appel au javascript, ce qui impose une contrainte supplémentaire : le client doit l'avoir activé (ce qui, aujourd'hui, devrait bien représenter 99% des utilisateurs voire plus, mais si ton site est dédié à une population très particulière, cela peut être génant).
Je vois, par ailleurs, dans le processus de passage de la page P1 à la page P2, deux sources possible à ton problème : les clics surnuméraires sur P1, avant que la page ne passe à P2, ou les clics faits sur P2, avant qu'elle ne soit totalement chargée. La méthode de résolution va varier suivant le cas.
Ce que je te propose (il existe bien d'autres moyens) serait d'afficher en surimpression à la page une zone grisée disant "chargement en cours".
Premier cas : au moment du clic.
Définition de la zone grisée :
Ces blocs ne sont pas visible en temps normal, ils peuvent être placés n'importe où dans le code source de la page, entre les balises <body> et </body>.
Il faut, au moment du clic, les rendre visibles. Sur tous les liens, il faut donc rajouter : onclick="javascript:prevent_dblclick()". Les liens deviennent donc <a href="truc" onclick="javascript:prevent_dblclick()">truc</a>
Et placer entre les balises <head> et </head> le code suivant :
Deuxième cas : au chargement de la page suivante.
Là, le problème est inverse : au début, les deux champs sont visibles. A la fin du chargement, on les masque. Cela va pouvoir se faire grâce à l'évènement onload de l'élément body.
Commençons par placer les deux blocs :
Sur cette balise <body>, justement, il faut donner les instructions :
<body onload="javascript:masque()">
Et, bien sûr pour finir, le code de la fonction masque à placer, là-encore, entre les balises <head> et </head> :
Voilà !
J'espère que ça pourra t'aider...
Xavier
Il existe des solutions pour résoudre ton problème. Par contre, je ne suis pas sûr qu'il y en ait qui ne fassent pas appel au javascript, ce qui impose une contrainte supplémentaire : le client doit l'avoir activé (ce qui, aujourd'hui, devrait bien représenter 99% des utilisateurs voire plus, mais si ton site est dédié à une population très particulière, cela peut être génant).
Je vois, par ailleurs, dans le processus de passage de la page P1 à la page P2, deux sources possible à ton problème : les clics surnuméraires sur P1, avant que la page ne passe à P2, ou les clics faits sur P2, avant qu'elle ne soit totalement chargée. La méthode de résolution va varier suivant le cas.
Ce que je te propose (il existe bien d'autres moyens) serait d'afficher en surimpression à la page une zone grisée disant "chargement en cours".
Premier cas : au moment du clic.
Définition de la zone grisée :
<div id="charge_bkg" style="position:absolute; width:100%; height:100%; background-color:#000; z-index:10; display: none; opacity: 0.5"></div> <div id="charge_mess" style="position:absolute; padding:15px; background-color:#fff; z-index:11; display: none; top: 300px; left: 300px; border:5px solid black; font-size:15pt">Chargement...</div>
Ces blocs ne sont pas visible en temps normal, ils peuvent être placés n'importe où dans le code source de la page, entre les balises <body> et </body>.
Il faut, au moment du clic, les rendre visibles. Sur tous les liens, il faut donc rajouter : onclick="javascript:prevent_dblclick()". Les liens deviennent donc <a href="truc" onclick="javascript:prevent_dblclick()">truc</a>
Et placer entre les balises <head> et </head> le code suivant :
<script>
function prevent_dblclick()
{
document.getElementById("charge_bkg").style.display="";
document.getElementById("charge_mess").style.display="";
}
</script>
Deuxième cas : au chargement de la page suivante.
Là, le problème est inverse : au début, les deux champs sont visibles. A la fin du chargement, on les masque. Cela va pouvoir se faire grâce à l'évènement onload de l'élément body.
Commençons par placer les deux blocs :
<div id="charge_bkg" style="position:absolute; width:100%; height:100%; background-color:#000; z-index:10; display: block; opacity: 0.5"></div> <div id="charge_mess" style="position:absolute; padding:15px; background-color:#fff; z-index:11; display: block; top: 300px; left: 300px; border:5px solid black; font-size:15pt">Chargement...</div>Pour plus d'efficacité, il faut les placer le plus tôt possible dans la page, donc juste après l'ouverture de la balise <body>.
Sur cette balise <body>, justement, il faut donner les instructions :
<body onload="javascript:masque()">
Et, bien sûr pour finir, le code de la fonction masque à placer, là-encore, entre les balises <head> et </head> :
<script>
function masque()
{
document.getElementById("charge_bkg").style.display="none";
document.getElementById("charge_mess").style.display="none";
}
</script>
Voilà !
J'espère que ça pourra t'aider...
Xavier
