Bonsoir à tous !
Je mets les pieds ici avec stupeur et tremblements, pour deux raisons :
- J'ai conscience que la page que je vais vous soumettre est écrite avec les pieds (avec du déchet pas encore nettoyé partout), et une bien mauvaise idée en soi (tout le site internet sur une même page, avec div affichées / cachées).
- Je ne comprends absolument rien au Javascript (hum). Ce qui est un peu con pour poser une question sur un forum javascript... Habituellement j'en aurais appris les rudiments, mais ce site a du être fait dans l'urgence, et doit être mis en ligne demain soir.
Mais je me dis qu'un œil averti verra peut-être l'origine du problème tout de suite, et je vous soumets donc la chose...
Le site fonctionne en cachant toutes les autres div que celle qu'on demande d'afficher. Mon souci (pas dramatique) est le suivant : l'infobulle que je crée avec javascript empêche ma page de se repositionner correctement quand je change de div affichée.
UN EXEMPLE DE MON PROBLÈME (voici la page) : http://ledebut.free.fr/FIDE/SITE6/index2
> Si vous allez sur "LES FILMS > Par Film > Blood on the window", et que vous scrollez en bas de la page, puis que vous cliquez sur "AGENDA" en haut à gauche : la page remonte toute seule pour se caler sur la hauteur de la div "agenda", et vous n'avez pas d'espace inutile en dessous du tableau horaire.
> Mais si vous faites F5 (nécessaire pour remettre le pb à zéro), que faites le même chemin ("LES FILMS > Par Film > Blood on the window") et qu'en bas vous cliquez sur "Mercredi 8 à 21h30", la page ne remonte pas. On se retrouve avec un grand vide qui restera bloqué tel quel tant qu'on aura pas réactualisé toute la page.
La différence entre les deux, c'est que sur "Mercredi 8 à 21h30", il y a une infobulle javascript. C'est l'origine du problème, car si je la supprime, tout remarche normalement.
Cette infobulle vient d'un code javascript que j'avais piqué tel quel il y a quelques années sur un tutoriel. Ma question est donc : y voyez-vous une couille évidente qui pourrait expliquer mon problème ?
Ce à quoi il faut rajouter un élément à mettre n'importe où sur la page :
Et pour l'appeler :
("slidereponse2" change la div de la partie centrale de la page, "slidereponse" change le contenu de la colonne orange pour mettre un div vide à la place)
Y a aussi du CSS pour la div (mais a priori on s'en fout ?)
Voilà, est-ce qu'il y a quelque chose d'évident comme le nez au milieu de la figure qui merde dans le code javascript ? (à part que mon site est écrit avec les pieds, donc)
Si ça implique de tout revoir de fond en comble et que c'est trop laborieux de chercher la solution, n'hésitez pas à me le dire, j'ai bien conscience d'arriver avec un truc assez foireux...
Modifié par TB54 (16 Mar 2015 - 13:50)
Je mets les pieds ici avec stupeur et tremblements, pour deux raisons :
- J'ai conscience que la page que je vais vous soumettre est écrite avec les pieds (avec du déchet pas encore nettoyé partout), et une bien mauvaise idée en soi (tout le site internet sur une même page, avec div affichées / cachées).
- Je ne comprends absolument rien au Javascript (hum). Ce qui est un peu con pour poser une question sur un forum javascript... Habituellement j'en aurais appris les rudiments, mais ce site a du être fait dans l'urgence, et doit être mis en ligne demain soir.
Mais je me dis qu'un œil averti verra peut-être l'origine du problème tout de suite, et je vous soumets donc la chose...
Le site fonctionne en cachant toutes les autres div que celle qu'on demande d'afficher. Mon souci (pas dramatique) est le suivant : l'infobulle que je crée avec javascript empêche ma page de se repositionner correctement quand je change de div affichée.
UN EXEMPLE DE MON PROBLÈME (voici la page) : http://ledebut.free.fr/FIDE/SITE6/index2
> Si vous allez sur "LES FILMS > Par Film > Blood on the window", et que vous scrollez en bas de la page, puis que vous cliquez sur "AGENDA" en haut à gauche : la page remonte toute seule pour se caler sur la hauteur de la div "agenda", et vous n'avez pas d'espace inutile en dessous du tableau horaire.
> Mais si vous faites F5 (nécessaire pour remettre le pb à zéro), que faites le même chemin ("LES FILMS > Par Film > Blood on the window") et qu'en bas vous cliquez sur "Mercredi 8 à 21h30", la page ne remonte pas. On se retrouve avec un grand vide qui restera bloqué tel quel tant qu'on aura pas réactualisé toute la page.
La différence entre les deux, c'est que sur "Mercredi 8 à 21h30", il y a une infobulle javascript. C'est l'origine du problème, car si je la supprime, tout remarche normalement.
Cette infobulle vient d'un code javascript que j'avais piqué tel quel il y a quelques années sur un tutoriel. Ma question est donc : y voyez-vous une couille évidente qui pourrait expliquer mon problème ?
<script language="javascript" type="text/javascript">
<!--
function GetId(id)
{
return document.getElementById(id);
}
var i=false; // La variable i nous dit si la bulle est visible ou non
function move(e) {
if(i) { // Si la bulle est visible, on calcul en temps reel sa position ideale
if (navigator.appName!="Microsoft Internet Explorer") { // Si on est pas sous IE
GetId("curseur").style.left=e.pageX - 110+"px";
GetId("curseur").style.top=e.pageY - 84+"px";
}
else { // Modif proposé par TeDeum, merci à lui
if(document.documentElement.clientWidth>0) {
GetId("curseur").style.left=20+event.x+document.documentElement.scrollLeft+"px";
GetId("curseur").style.top=10+event.y+document.documentElement.scrollTop+"px";
}
else {
GetId("curseur").style.left=20+event.x+document.body.scrollLeft+"px";
GetId("curseur").style.top=10+event.y+document.body.scrollTop+"px";
}
}
}
}
function montre(text) {
if(i==false) {
GetId("curseur").style.visibility="visible"; // Si il est cacher (la verif n'est qu'une securité) on le rend visible.
GetId("curseur").innerHTML = text; // Cette fonction est a améliorer, il parait qu'elle n'est pas valide (mais elle marche)
i=true;
}
}
function cache() {
if(i==true) {
GetId("curseur").style.visibility="hidden"; // Si la bulle etais visible on la cache
i=false;
}
}
document.onmousemove=move; // des que la souris bouge, on appelle la fonction move pour mettre a jour la position de la bulle.
//-->
</script>
Ce à quoi il faut rajouter un élément à mettre n'importe où sur la page :
<div id="curseur" class="infobulle"> </div>Et pour l'appeler :
<a class="bulle" class="question" href="javascript:slidereponse2('Agenda')" onmouseover="montre('Texte de linfobulle');" onmouseout="cache();" onclick="javascript:slidereponse(Vide_sousmenu);">Mercredi 8 à 21h30</a>("slidereponse2" change la div de la partie centrale de la page, "slidereponse" change le contenu de la colonne orange pour mettre un div vide à la place)
Y a aussi du CSS pour la div (mais a priori on s'en fout ?)
.infobulle{
position: absolute;
text-align: left;
visibility : hidden;
border: 1px solid #364755;
color:black;
padding-left: 10px;
padding-right: 10px;
padding-top: 6px;
padding-bottom: 6px;
font-family: Arial;
font-size: 11px;
background-color: #BFCCD7;
}
Voilà, est-ce qu'il y a quelque chose d'évident comme le nez au milieu de la figure qui merde dans le code javascript ? (à part que mon site est écrit avec les pieds, donc)
Si ça implique de tout revoir de fond en comble et que c'est trop laborieux de chercher la solution, n'hésitez pas à me le dire, j'ai bien conscience d'arriver avec un truc assez foireux...
Modifié par TB54 (16 Mar 2015 - 13:50)
!
. Il faut dire (à ma décharge 
) que ton code n'est pas très limpide 
.