11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je suis en train de réaliser un site qui comporte un sous-menu.
Pour des raisons de compatibilité entre IE6 et les autres navigateurs, j'ai décidé d'opter pour une forme de sous-menu propre à IE6

Le problème soulevé dans ce topic ne concerne donc que l'apparition du sous-menu sous IE6

Voici donc l'adresse du site encore en développement : http://www.botmobil.org

Sous IE6 donc, le sous-menu ressemble aujourd'hui à ceci :

http://img144.imageshack.us/img144/6664/sousmenubotmobilhf7.jpg

Je souhaiterai que le fond du sous-menu soit arrondi aux 4 coins.
J'ai donc fait appel à jQuery et à son extension rounded visible ici : http://www.malsup.com/jquery/corner/

Après moult essais, j'ai bien réussi à l'utiliser sur un div situé en pleine page.
Par contre pour le sous-menu, niet, ça ne marche pas.

Je pensais au départ que le pb venait de mes div qui comportaient à la fois une classe et un identifiant (ex. : #sousmenu5.apparent )
Mais après essais, jQuery arrondi très bien un div ainsi qualifié.

Le problème semblerait donc plus venir du "dynamisme" du menu/sousmenu
En effet, j'ai opté pour un code javascript qui change la classe .cache du div du sous-menu en .apparent au survol du menu idoine

Et je pense que c'est cette opération n'est pas bien géré par jQuery, ou plus généralement par Javascript.

Qu'en pensez-vous ? Existe-t-il une solution ?
Modifié par Spheerys (03 May 2007 - 16:32)
Problème toujours d'actualité car je vois bien ton menu aux coins arrondis maintenant ?
Modifié par The Jedi (02 May 2007 - 16:53)
Sic c juste pour te confirmer qu'avec IE6 le pb est pas réglé.

par contre je ne connais pas Jquery juste lu la presentation sur ce site.
ça a l'air bien. Est ce vraiment si facile d'apprentissage?.

mais ne peux tu pas revenir a une solution plus classique pour ce sous menu? Bon c'est vrai qu'avec ton fond en épi de blé c pas facile a gérer.
Modifié par CPascal (02 May 2007 - 19:46)
J'avais les coins arrondis avec Firefox. Maintenant sur le site de démo, avec IE6 ça passe sans soucis (après un certain temps de chargement, IE doit avoir plus de mal pour le JS).

Ce qui m'étonne c'est que tu appliques les coins aux éléments de classe "apparent" et qu'au chargement de la page, il n'y en a aucun. Pourquoi ne pas plutôt faire ça ?
$('div[@id^=sousmenu]').corner('10px');


Quand ils apparaitront, ils auront leurs coins normalement (sauf si cette extension modifie la visibilité des div).

Sinon après je pencherais vers un problème de marges sous IE : essaye en espaçant davantage les éléments de liste. D'ailleurs y'a pas besoin d'imbriquer <div> et <ul>, le <ul> suffit.
a écrit :
Ce qui m'étonne c'est que tu appliques les coins aux éléments de classe "apparent" et qu'au chargement de la page, il n'y en a aucun. Pourquoi ne pas plutôt faire ça ?

Effectivement, en suivant ton conseil jQuery applique bien le bon style !
Mais j'ai maintenant un nouveau pb qui me donne déjà mal à la tête... : au lieu d'avoir des coins arrondi, j'ai une sorte de rectangle de couleur uni en haut et en bas de chaque sous-menu...
Je pense que c'est du à l'effet de transparence qui n'est pas bien géré par jQuery...

Pffffff je me demande si je ne vais pas opter pour un menu plus classique, sans fioriture, du moins pour IE6.... Smiley sweatdrop