Sujet Précédent Sujet Suivant

Une boite flotante capricieuse

cs_Nathbest Messages postés 9 Date d'inscription vendredi 4 octobre 2002 Statut Membre Dernière intervention 18 juillet 2008 - 5 mars 2008 à 23:32
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 - 7 mars 2008 à 12:49
Bonjour à tous, alors voici mon problème:

J'ai un système de boite flotante qui s'affiche à moitié caché sur la gauche, puis losque l'on passe la souris la boite glisse vers la droite pour s'afficher en entier, puis lorsque l'on clique à l'intérieur de la boite flotante, la boite se recache à moitié en repartant sur la gauche.

Donc premièrement, ce CODE, affiché plus bas, fonctionne parfaitement sur FireFox et Internet Explorer 7,
mais le problème est que une fois que j'y ajoute toute la déco de mon site (div, bloc, texte, etc...) bin ce système de boite ne fonctionne plus que sur Internet Explorer...
Firefox affiche bien la boite caché mais le système de glissade pour l'ouverture ne fonctionne pas, puis lorsque je clique sur la boite, la boite ne se referme pas!

Donc voilà mon CODE, je ne sais pas si c'est ma programmation qui est mauvaise mais bon, je compte sur vous...

Mon CODE:


<hr />
<head>

<style type="text/css" media="screen">

/* BLOC gauche menu déroulant */
#menuderoulant {
  background: url('image/boite.png') no-repeat top left;
  position:fixed;
  top:145px;
  width:160px;
  height:110px;
  padding-top: 9px;
  padding-bottom: 9px;
  padding-left: 20px;
  padding-right: 30px;
  visibility: visible;
}

</style>

<script>
<!-- fonction Menu déroulant gauche -->

var netscape4=document.layers?1:0
var internet_explorer4=document.all?1:0
var netscape6=document.getElementById&&!document.all?1:0

var p=-135;

if (internet_explorer4||netscape6){
 document.getElementById("menuderoulant").style.left=p;
 }
  else {
 document.layers.menuderoulant.style.left=p;
 }

function h_open(){
    if (internet_explorer4||netscape6){
 document.getElementById("menuderoulant").style.left=p;
 }
 else {
 document.layers.menuderoulant.style.left=p;
 }
 if(p < 0) { p=p+5; setTimeout("h_open()",1); }
 }
 
function h_close(){
    if (internet_explorer4||netscape6){
 document.getElementById("menuderoulant").style.left=p;
 }
 else {
 document.layers.menuderoulant.style.left=p;
 }
 if(p > -135) { p=p-5; setTimeout("h_close()",1); }
 }

</script>

</head>

<!--  // Affichage Boite flotante sur la gauche    -->

<script>
if (internet_explorer4){
document.write('
');}
if (netscape6){
document.write('
');}
else {
document.write('<layer id="menuderoulant" style="left:'+p+'px;" onClick="h_close()" onMouseover="h_open()">');}

document.write('[aide.php Besoin d\'aide !]
');

if (internet_explorer4||netscape6){
document.write('
');}
else {
document.write('</layer>');}
</script>

<hr />
Et si vous avez d'autres systèmes de boite glissante ou autre que vous voulez que j'essaye, il n'y a pas de soucies.

Allez merci encore, saloute

4 réponses

Réponse 1 / 4
nickadele Messages postés 1251 Date d'inscription mercredi 7 août 2002 Statut Modérateur Dernière intervention 10 avril 2013
6 mars 2008 à 09:41
Bonjour,

je pense que ceci est plus correct :
....style.left=p +"px";

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
0
Réponse 2 / 4
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
6 mars 2008 à 09:57
Bonjour,

    tel que tu nous donnes les choses....
   
..
var p= -135;
if (internet_explorer4||netscape6){
 document.getElementById("menuderoulant").style.left=p;

    est fait avant que menuderoulant ne soit créé !
    ça plante ( ie et ff )

 }
  else    ...

ensuite :
>>Donc premièrement, ce CODE, affiché plus bas, fonctionne parfaitement sur FireFox et Internet Explorer 7,
     à la restriction ci-dessus près non ?
>>mais
le problème est que une fois que j'y ajoute toute la déco de mon site
(div, bloc, texte, etc...)
>>bin ce système de boite ne fonctionne plus
que sur Internet Explorer...
    certes... mais nous on ne la pas ce que tu ajoutes !
    il y a donc probablement quelque chose qui perturbe FF !

    en l'état actuel, je ne peux que te dire :


¡————————¡——————————————————————————————————————————————————————————¡
|FireFox |regarder la "console d'erreurs" |
| | Outils / Console d'erreurs |
| | |
| | et mieux, télécharger FireBug |
¦————————¦——————————————————————————————————————————————————————————¦
|Internet|activer le deboggage : Outils/options Internet/Avancés |
|Explorer| dans la liste, sous "Navigation" : décocher |
| | ° Afficher une notification de chaque erreur de script |
| | ° Désactiver le débogage de Scripts (Internet Explorer) |
| | |
| | et mieux, télécharger =2f465be0-94fd-4569-b3c4-dffdf19ccd99&displaylang=en le Debogger IE |
¦————————¦——————————————————————————————————————————————————————————¦
|K—Meleon|regarder la "console d'erreurs" |
| | Outils / Console d'erreurs |
¦————————¦——————————————————————————————————————————————————————————¦
|Opera |regarder la "console d'erreurs" |
| | utils / Asole d'erreurs |
¦————————¦——————————————————————————————————————————————————————————¦
|Safari |regarder Debug / Show JavaScript Console |
| | |
| |modif Fichier "Support:\Documents and Settings\utilisateur|
| |\Application Data\Apple Computer\Safari\Preferences.plist"|
| | y ajouter <key>IncludeDebugMenu</key> |
| | <true/> |
!————————!——————————————————————————————————————————————————————————!

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
0
Réponse 3 / 4
cs_Nathbest Messages postés 9 Date d'inscription vendredi 4 octobre 2002 Statut Membre Dernière intervention 18 juillet 2008
6 mars 2008 à 22:54
Bon [auteur/NICKADELE/13477.aspx nickadele] et [auteur/BULTEZ/51635.aspx bultez], merci, je viens d'effectuer les modifications:

-Alors j'ai d'abord supprimer cette partie si:

if (internet_explorer4||netscape6){
 document.getElementById("menuderoulant").style.left=p;
 }
  else {
 document.layers.menuderoulant.style.left=p;
 }

J'ai certainement du effectuer un copier/coller qui a mal pris, mais bon malgrès cette modification ça ne fonctionnait toujours pas.
Donc:

-J'ai effectué les modifications suivantes:

J'ai remplacé .style.left=p;  par  .style.left=p +"px";

Et puis là tout fonctionne à merveille.
Merci encore, ciao.
0
Réponse 4 / 4
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
7 mars 2008 à 12:49
Bonjour,

1/ Attention la position
fixed n'est pas prise en compte par IE < 7, encore très présent, peut être
lui préférer la position absolute...

2/ Beaucoup de référence à
NetScape 4, notion de layers, il te faut les supprimer pour
clarifier ton code...

3/ Il est également nécessaire de détruire le
Timeout en cours pour éviter des effets d' aller/retour hésitants sur des move
de la souris...

Ton script se résumerait à ceci
<script type= "text/javascript">
<!-- fonction Menu déroulant gauche -->
var p =-135;
var iTimer = null;
function h_open(){
clearTimeout( iTimer);
document.getElementById("menuderoulant").style.left = p +"px";
if(p < 0){
p=p+5;
iTimer = setTimeout("h_open()",1);
}
}
function h_close(){
clearTimeout( iTimer);
document.getElementById("menuderoulant").style.left = p +"px";
if(p > -135){
p=p-5;
iTimer = setTimeout("h_close()",1);
}
}
</script>

et
idem dans la partie
...toutes les remarques faites ci avant restant valables...
;O)
0

Discussions similaires

fermer boite de dialogue (j'ai déjà posé la question, mais impossible d'y arrive
cs_marsupio -
mavreick -

7 réponses
Ouvrir une boîte de dialogue
moongui -
Adeon -

2 réponses
Fermer une boite de dialoque Excel
geolap74 -
geolap74 -

3 réponses
créer clef d'enregistrement
zuddap -
Mayzz -

30 réponses
Insérer bitmap dans un bouton dans une boite de dialogue
cs_safira -
vecchio56 -

3 réponses
Rejoignez-nous