[Scriptaculous] Effet Slide.DOwn de Script.aculo.us

[eppo81]

Bonjour,

J'utilise actuellement la librairie script.aculo.us et plus particulièrement la fonction Effect.SlideDown.
La situation est la suivant : j'ai un <div> sur ma page web et quand l'utilisateur passe la souris dessus, je souhaite faire apparaitre avec un effet déroulant un second <div>. Comme le second <div> doit être caché au chargement de la page, je lui applique le style "display: none". Pour cela j'utilise le code suivant :

Code :

1
2
3
4
5
6
 
<div id="Menu_haut_Titre" onmouseover="new Effect.SlideDown 'Sous_menu_haut_1', {duration:1});">MENU 1</div>
     <div id="Sous_menu_haut_1" style="display: none">
          <div>Sous-Menu 1</div>
     </div>
</div>

Le résultat est le suivant :
- au chargement de la page, le second <div> est bien caché.
- quand je passe la souris sur le premier <div>, le second <div> apparait un court instant à sa place, disparait puis déroule normalement.

Comment faire pour qu'il n'apparaisse plus avant de dérouler normalement ?

Merci

[dingoth]

Ceci devrait plutôt se trouver dans la partie JavaScript du forum, mais bon...

Le problème vient probablement de la visibilité de ton objet : tu lui mets un display: none; alors qu'il vaudrait mieux utiliser visibility: hidden. Pour la bonne raison que le display n'est pas là pour cacher un objet à la base, mais pour dire si l'objet doit être considéré comme un bloc, comme du texte "en ligne", etc.

[_Mac_]

Envoyé par eppo81

Code :

C'est quoi la parenthèse fermante à la fin ? Ca n'a peut-être (et même sûrement) rien à voir mais ça me paraît louche en tout cas.

[dingoth]

Bah si, ça a tout à voir : il manque la parenthèse du début

[eppo81]

Bonjour,

Concernant la parathèse : c'est juste un oubli dans le post, je l'ai bien mise dans le code de la page.

J'ai essayé avec visible=hidden mais le fait d'appliquer l'effet SlideDown sur le div ne change pas le style visibility de hidden à visible --> le dic n'apparait pas.