Salut  
 
le site avec le menu "déroulant" classique:
http://www.microsoft.com/france/ms.htm
 
le site avec le menu "déroulant" dynamique :
http://www.omnikles.com/
 
Je viens de voir sur ce site, un superbe menu déroulant en javascript. Pour ma part je sais faire des menus dynamiques classiques avec du Javascript et des calques (comme sur le site de microsoft) mais je ne vois absolument pas comment faire pour que le menu ait cet effet "déroulant"... peut-être en jouant avec un effet DHTML que je ne connais pas...
 
Quelqu'un aurait-il un lien avec lequel je peux apprendre à faire de tels menus? Ou tout simplement quelqu'un pourrait me dire comment provoquer cet effet?
 
Plize

[jfdsdjhfuetppo]--Message édité par Roco le 24-04-2002 à 21:01:58--[/jfdsdjhfuetppo]

ca rame leur truc
c effectivement du dhtml, cherche des tutoriaux tt simplement...

meme en editant la source, tu dois y arriver...

Ben c un peu tendu sachant que y'a pleins de frame et que les scripts sont tous dans des fichiers séparées... enfin ça à la limite c'est pas trop grave mais bon le problème c'est que le code est très compliqué et ressemble fortement à un truc pondu par un wysiwyg...
 
Personne n'a une idée???

Ça va meme pas avec mozilla. A quoi ca sert?

Comme ça ?
 
http://darkoli.free.fr/js/menu.htm (pour IE).

 
Exactement comme cela il me semble...
 
1/ Apparement tu me dis que c'est juste pour IE et donc tout de suite ça m'embete un peu (j'aime nos amis handicapés de OSA)...
 
2/ Apparement tu as boqué la vision de la source (d'ailleurs au passage ça m'intéresse de savoir comment tu as fait...)
 
3/ Peux-tu me dire comment faire un bo menu comme cela?

Heu ben chui idiot... j'ai qu'a enregistrer la page pour voir la source

Heu c'est pas évident ton code... un petit coup de main pour m'expliquer comment passer d'un menu à la Microsoft que je sais faire, à un menu pseudo-déroulant comme toi...

 
ok
 
pour le source : affichage->source

je croa ke ca il avit compris

Scuse moi tu utilises peux juste expliquer un peu comment tu obtiens l'effet déroulant (c'est juste ce petit bout qui m'intéresse...)

 
En gros j'ai une structure de donnes pour chaque element du menu !!!
 
Tain merde j'ai oublié de commenter le code !!! (C'est con ça).
 
En gros chaque element est un Div. Je connais la position qu'il doit avoir lorsque 'il est ouvert et je sais où il se trouve quand le menu est fermé (même position que le "sur menu" dont il est le sous menu).
 

 
Donc quand j'ouvre un menu :
 1° J'initialise la position du menu en fonction du "sur menu" (x et y)
 2° Je le rends visible
 3° Je le déplace p fois.
  => pas pour x : ((dx-x) / p) * i (i varie de 1 à p)
  => pas pour y : ((dy-y) / p) * i (i varie de 1 à p)
 4° Ben c'est fini il est en place.
 
Le problème c'est que mon code est pas lisible du tout (mais alors pas du tout) désolé !!!

[jfdsdjhfuetppo]--Message édité par DarkOli le 23-04-2002 à 23:04:13--[/jfdsdjhfuetppo]

Voila un exemple simple de deplacement ...

 
Tu vois, là, j'hésite soit à te traiter d'imbécile ou à être sympa et t'expliquer qu'utiliser un browser valable, n'est pas réservé à ceux qui utilise des os dit alternatifs. Mozilla est un browser libre, stable, multi plateforme, rapide, sécurisé, qui respecte les normes et les derniers formats supérieurs technologiquements. IE n'a aucune de ces qualités ni aucune autre, la seule qu'il ait, c'est qu'il permet à microsoft d'augmenter son monopole en étant imposé sur les ordinateurs.  
 
Le plus amusant, c'est que les gens traitent les linuxiens d'intégristes alors que je vois de plus en plus souvent que c'est totalement l'inverse. C'est en pensant comme toi que beaucoup de personnes ont peur d'essayer quelque chose de different et qu'il restent prisonnier.

 
1/ Je ne comprends pas très bien cette ligne... Elle implique la récurrence de la fonction b() toutes les 100ms? Je te remercie bcp pour ton deuxième exemple car il me permet de bcp mieux comprendre en tout cas...
 
2/ Ce type de menu (et plus généralement de déplacement) est apparamment propriétaire IE, car Netscape 6.2 et Mozilla ne le gère pas et ça devient super chiant si c'est dans le cadre d'un menu et que l'internaute est coincé... (utilises-tu ce genre de menu pour tes sites?) Entre esthétisme et compatibilité le choix et dur...

 
Désolé je lis ton post trop tard (après en avoir posté un autre qui reprend le sujet). Voilà quand même une réflexion :
 
1/ Pour surfer et profiter au maximun de la plupart des effets contenus sur les sites web à l'heure actuelle, IE est sans conteste le meilleur (tu n'as qu'à pour preuve matter le lien de mon premier post avec Mozilla et IE).
 
2/ Tu peux me reprocher que dans ce cas là le codeur du site est un crétin... peut-être mais moi jm'en tape, ce que je veux c'est pouvoir matter les sites en en tirant le meilleur parti!
 
3/ Perso j'ai IE 6.0 avec Win 2000 Pro et je n'ai jamais de plantage de IE... je fais de petits update de tps en tps c tout! Et je ne crois pas que IE soit trop nul du point de vue de la sécu... y'a intérêt d'ailleurs car je m'y connais un peu (chui en ce moment stagiaire admin sys/rézo et de plus je fais bcp d'achat sur le net.
 
4/ Pas de pb pour les gens qui utilise Mozilla, Netscape, Tarte aux pommes... Tout le monde est libre de se faire une opinion, y'a ka voir les dernières élections  
 
5/ Perso quand je fais des sites je prends la peine de tester sous IE, Opéra, Netscape et Mozilla, mais bon dans tout les cas je privilégie bien sûr IE si un choix difficile se présente...
 
Voilà

moi j'ai fait plutôt comme çà
 
http://manoo.fr.st/menu/menu2.php
 
et çà marche sous IE5+ et NN6
 
et je suis en train de l'intégrer à mon site perso que je suis en train de complètement refaire.

1/ Pour surfer et profiter au maximun de la plupart des effets contenus sur les sites web à l'heure actuelle, IE est sans conteste le meilleur (tu n'as qu'à pour preuve matter le lien de mon premier post avec Mozilla et IE).
 
Même pour aller là ? http://www.glandium.org/
Essaye avec Mozilla, et avec IE6. Tu m'en diras des nouvelles.
 
 
2/ Tu peux me reprocher que dans ce cas là le codeur du site est un crétin... peut-être mais moi jm'en tape, ce que je veux c'est pouvoir matter les sites en en tirant le meilleur parti!
 
C'est pourtant un fait. Tu peux aussi lui écrire pour lui signaler que son site n'est pas conforme aux normes.
 
 
3/ Perso j'ai IE 6.0 avec Win 2000 Pro et je n'ai jamais de plantage de IE... je fais de petits update de tps en tps c tout! Et je ne crois pas que IE soit trop nul du point de vue de la sécu... y'a intérêt d'ailleurs car je m'y connais un peu (chui en ce moment stagiaire admin sys/rézo et de plus je fais bcp d'achat sur le net.
 
Ah ouais, dis-moi, le fait d'être stagiaire sysadmin, ça ne t'a visiblement pas inculqué la première qualité du sysadmin, à savoir la paranoïa. Comment peux-tu accorder ta confiance à un logiciel non-libre, dont les failles ont jusqu'à présent été corrigées avec des délais absolument inacceptables... pour certaines !
 
 
4/ Pas de pb pour les gens qui utilise Mozilla, Netscape, Tarte aux pommes... Tout le monde est libre de se faire une opinion, y'a ka voir les dernières élections ;)
 
Justement, si les concepteurs de sites ne respectent pas les normes, ces gens-là sont priés de rentrer chez eux, sous prétexte qu'ils sont une minorité. Désolé, c'est complètement contraire à mes principes.
 
 
5/ Perso quand je fais des sites je prends la peine de tester sous IE, Opéra, Netscape et Mozilla, mais bon dans tout les cas je privilégie bien sûr IE si un choix difficile se présente...
 
Bin moi, je privilégie les normes. Ceux qui n'ont pas un navigateur conforme sont priés d'aller se faire foutre. Microsoft comme Opera font partie du W3C, et ils sont toujours incapables d'implémenter les normes qu'ils ont adopté.

corollaire du débat : pourquoi la majorité des sites que je trouve les plus intéressants et agréables à surfer utilisent-ils très peu de js, seulement qq images par ci par là, bref très peu de super technologie qui au final n'a pas l'air de servir à grand chose ?
 

youdontcare a écrit a écrit : corollaire du débat : pourquoi la majorité des sites que je trouve les plus intéressants et agréables à surfer utilisent-ils très peu de js, seulement qq images par ci par là, bref très peu de super technologie qui au final n'a pas l'air de servir à grand chose ?

il peuvent en utiliser sans ke ca se voie (php, asp, xml..)

effectivement, c'est pas la joie.
 
* ie6 : ne supporte pas la transparence du logo et de la table.
 
* mozilla 0.9.9 : se chie dessus en affichant le logo lors du premier affichage de la page et ne rafraîchit pas correctement l'image de fond lorsqu'on scrolle (mes fenêtres web font en général ~800x850).

tout à fait j'adore les technos côté serveur, vu que ça ne dépend pas du client. mais les menus à la con en js, les effets de transparence & co me soulent.

 
Tu peux faire un beau site compatible et c'est le choix que j'ai fait. Pour ce type de menus si je les ai fait c'est pour moi.
 
Mais en général les sites que je fais sont simple (pas de javascript) juste un peu de CSS.

youdontcare a écrit a écrit : corollaire du débat : pourquoi la majorité des sites que je trouve les plus intéressants et agréables à surfer utilisent-ils très peu de js, seulement qq images par ci par là, bref très peu de super technologie qui au final n'a pas l'air de servir à grand chose ?

 
Oui c'est clair !!!
Moi par exemple si j'ai fait un peu de javascript c'est pour me faire des petits jeux sur ie quand je me faisais chier.

 
1/ Tout a fait ok avec toi youdontcare... l'exemple de jar jar est nul car ça chie aussi avec Mozilla (je aussi suis obligé de faire un refresh...)
 
De plus l'exemple de site privilégiant Mozilla par rapport à IE est ... un site perso sur free. Super représentatif des grands sites, dont l'affluence est tellement forte que la problématique de la compatibilité, avec tous les navigateurs, est importante.
 
2/ Je préfère faire un site compatible avec 90% des navigateurs internet utilisés à ce jour, à savoir IE, plutôt que de me faire un site respectant les rules of the w3.org et d'aller dire aux gens d'aller changer leur navigateurs internet sous pretexte que celui-ci en'st pas gentil et qu'il ne respecte pas le w3.org  
 
Je pense que facilement 70% des internautes ne savent pas  comment installer un navigateur internet et que 95% des internautes n'ont jamais entendu parler du w3.org (j'imagine leur réaction : "w3, c'est koua ça? du catch?" ).
 
3/ Quand au fait d'utiliser ou non du JS, cela dépend de ce que l'on veux faire et de l'ergonomie que l'on veut adopter... ok faire du JS juste pour dire whaouuu mon super bô site il est mortel trop compliqué et mortel trop fort... c nul. Mais bon si c'est pour faire répondre à des spécifications définies dans le contrat alors on peut facilement passer plusieurs jours à dév en javascript ou des feuilles de style (je parle même pas du côté serveur et de la partie gestion/admin de site).
 
D'ailleurs là je galère à fond... voir mon prochain post

>> darkoli :
 
1/ Je te remercie bcp pour ton aide et pour le script de ton menu!
 
2/ Je voudrais savoir si c'est toi qui a conçu de A à Z ce menu, ou si tu l'as repompé du net, ou encore si tu l'a modifié et dans ce cas dans quel mesure?
 
 2.1/ J'ai passé 45 min avec un autre stagiaire dév (lui de DUT INFO) pour tenter de le déchiffré et franchement, on a galéré et on a pas du tout avancé... Résultat je me suis fait durement tiré les oreilles par mon chef!
 
 2.2/ Franchement, je le trouve pas super clair. Il n'y a pas de commentaire, il utilise des déclarations de variables, avec des noms bizzares, dans tous les sens et dans tous les endroits, il fait appelle à pleins de fcts dont j'ai du mal à définir les rôles.
 
 2.3/ Peux-tu me filer un (grand) coup de main pour m'aider à le comprendre (c'est ouvert à tout le monde)?
 
3/ J'ai du mal à comprendre le modèle objet en javascript...
En java, on crée un classe pour définir un objet, et dans cette classe, je place les champs de classe/d'instance et les méthodes de classes/d'instance. En javascript, c'est bcp plus flou je trouve et je comprends pas très bien cet exemple : http://www.toutjavascript.com/savoir/savoir01.php3
soit c'est bcp moins formel, soit chui largé de A à Z...
 
cette fonction joue-t-elle aussi le rôle d'un constructeur : function CreerChien(le_nom,la_race) {
 this.nom=le_nom;
 this.race=la_race;
}
???

 
1. Merci
2. Fait tout seul comme un grand et comme un porc (exemple de script un peu mieux realisé : http://darkoli.free.fr
2.1 Quand tu débute en javascript c'est pas évident car il utilise une structure sous forme d'arborescence représentant le menu (l'équivalent d'une structure sauf quand javascript l'implementation d'une structure et bizarre !!! => 1° fonction du source).
2.2 Nous sommes d'accord !!!
3. Oui !!! En gros du déclare et instancie ta classe grçace à une fonction !!! Sachant qu'en javascript une variable et tout et n'importe quoi à la fois !!! Une variable peut être un entier, une chaine de caracteres, une image, une reference à un objet de la page HTML ou une fonction !!!
4. Je vais voir si je peux clarifier le truc demain en simplifiant le menu

Roco >>
 
pour le modèle objet javascript, c'est en fait très simple. toute balise d'une page html est un objet, et tu peux créer d'autres objets toi-même avec new.
 
eg
 
var obj = new Object;
 
tu peux lui assigner ...
 
des variables :
 
obj.var1 = 'variable 1';
obj.var2 = 45;
obj.anotherObject = new Object;
 
des méthodes :
 
function showVar1Var2()
{
  alert(this.var1);
  alert(this.var2);
}
 
obj.showMe = showVar1Var2;
 
obj.showMe(); // appelle showVar1Var2, qui a accès aux propriétés (variables + méthodes) de l'objet par this.
 
obj = new creerChien("nom", "race" ) créé un nouvel objet (new) en appelant une méthode (CreerChien) qui a accès au nouvel objet créé par this, et peut donc lui donner de nouvelles variables.
 
//
 
si tu veux modifier une balise, par ex du texte contenu dans un <span>, tu lui donnes un nom avec son attribut id :
 
<span id='mySpan'>ceci est ma balise</span>
 
en js, tu as donc accès à la balise par le nom mySpan. (utiliser getElementById() sous mozilla)
 
alert(mySpan.tagName); // affiche 'SPAN'
 
tu peux aussi lui rajouter des variables :
 
mySpan.newVar = 'texte';
mySpan.newVar2 = 12387;
mySpan.extraData = 'des données en plus ...';
 
mySpan a également des méthodes, par ex onmouseover, qui est null par défaut. tu veux changer ce comportement, tu définis une nouvelle fonction :
 
function showExtraData()
{
  alert(this.extraData);
}
 
tu l'assignes au comportement onmouseover (qui n'est qu'une variable qui contient en fait un pointeur vers une méthode) :
 
mySpan.onmouseover = showExtraData;
 
et ta méthode sera appelée lorsque tu passeras la souris sur ta balise.
 
//
 
voilà, c'est tout simple.  
 
pour revenir au menu de ton premier message, ils utilisent en fait la fonction de clipping des css : tu donnes un rectangle, seule la zone contenue dans ce rectangle est affichée. pour donner l'effet d'animation, ils changent ce rectangle à coups de setTimeout() ou setInterval().
 
http://www.w3.org/TR/REC-CSS2/visufx.html
 
donc, pour faire ton menu, tu créés un <div> que tu remplis avec ce que tu veux, (une table de cellules contenant un lien), tu l'affiches à la position du nom du menu, tu modifies dynamiquement la taille de clip.

[jfdsdjhfuetppo]--Message édité par youdontcare le 24-04-2002 à 21:44:18--[/jfdsdjhfuetppo]

>> youdontcare
 
Merci pour tes explications... entre autre, je ne pensais pas que tout élément html était désormais considérable comme un objet.  
 
Il faudrait aussi que je me penche sur le nouveau DOM car je pourrais ptet me servir des noeuds pour de futurs menus...
 
Sinon je pensais aller demain sur le site de la w3 pour DL les spécifications CSS et (D)(X)HTML, donc pas de pb!  
 
>> darkoli
 
Franchement je dois rendre ce script demain soir à mon chef (en sachant que j'ai des millions d'autres trucs à faire) donc si tu penses pouvoir le retoucher un peu demain pour que je puisse plus facilement le comprendre, c serait vraiment sympa!
 
Jte file mon e-mail prof : eric.ledonge@kiss-technologies.com si tu pouvais juste m'envoyer un ptit mail pour me prévenir ce serait vraiment cool car je ne pense pas me passer par le forum demain...
 
Ben sinon j'ai plus qu'à me prendre le chou sur setTimeout() ou setInterval().

[jfdsdjhfuetppo]--Message édité par Roco le 24-04-2002 à 22:36:04--[/jfdsdjhfuetppo]

 
Tu n'a pas tres bien compris a quoi servait l'exemple alors. Le webmaster a voulu faire un site beau graphiquement, avec les dernieres "nouveautés" et en respectant les normes. Si tu arrive a faire la même chose avec ie, bravo mais c'est impossible.
 

 
Moi je prefere faire un site respectant les normes et passant sur 99,8% des navigateurs.
 

 
Bien sur, les gens sont cons. Heureusement que tu choisis pour eux.

>> daique
 
Ok, no comment... on est d'accord, mais bon c'est dommage, on se prive de plusieurs effets IE sympa (genre <marque> entre autre...) Je sais qu'om peux les faire "à la main" mais bon c'est plus long et plus chiant, chui féniant tu peux voir mon Post sur Coldfusion à ce sujet  
 
>> darkoli, youdontcare
 
Chui un peu idiot, jviens seulement de comprendre pkoi je captais rien depuis un bon moment!
 
On déclare une méthode en JS comme on déclare un attribut (avec un this), quand on vient de Java, c'est hallucinant de voir cela... c'est kom si je voyais deux concepts différents de la POO.  
 
En tout cas maintenant, darkoli jviens de me rendre compte que j'aurais décidément bcp de mal à déchiffrer ton script sans comments...

[jfdsdjhfuetppo]--Message édité par Roco le 24-04-2002 à 23:12:36--[/jfdsdjhfuetppo]

Roco a écrit a écrit : >> daique   Ok, no comment... on est d'accord, mais bon c'est dommage, on se prive de plusieurs effets IE sympa (genre <marque> entre autre...) Je sais qu'om peux les faire "à la main" mais bon c'est plus long et plus chiant, chui féniant tu peux voir mon Post sur Coldfusion à ce sujet     >> darkoli, youdontcare   Chui un peu idiot, jviens seulement de comprendre pkoi je captais rien depuis un bon moment!   On déclare une méthode en JS comme on déclare un attribut (avec un this), quand on vient de Java, c'est hallucinant de voir cela... c'est kom si je voyais deux concepts différents de la POO.     En tout cas maintenant, darkoli jviens de me rendre compte que j'aurais décidément bcp de mal à déchiffrer ton script sans comments...

ca va etre encore + dur en restant toute la journee sur le forum

 
c'est bien comme çà que j'ai procédé et avec l'utilisation de l'opérateur this et de la méthode GetElementByID mais çà marche pas avec mozilla mais farpaitement avec IE et NN6.
Bon ben quand j'aurais un moment j'approfondirai le truc

sous mozilla 0.9.9 :
 
mySpan = document.getElementById('mySpan';
 
// puis le reste, pareil :
 
alert(mySpan.tagName); // affiche 'SPAN'  
 
tu peux aussi lui rajouter des variables :  
 
mySpan.newVar = 'texte';  
 
...
 

youdontcare a écrit a écrit : sous mozilla 0.9.9 :   mySpan = document.getElementById('mySpan';   // puis le reste, pareil :   alert(mySpan.tagName); // affiche 'SPAN'     tu peux aussi lui rajouter des variables :     mySpan.newVar = 'texte';     ...

 
oui c'est exactement ske j'ai fait :-/
çà doit être ailleurs que j'ai merdé
 
Mozilla 0.9.9 ? j'ai trouvé que la 0.9.8 môa ? c ptete pour çà.
 
edit : g rien dit chui allé directement sur mozilla.org pour choper la 0.9.9 et je regardes ski va pas

[jfdsdjhfuetppo]--Message édité par m@nou le 25-04-2002 à 08:41:57--[/jfdsdjhfuetppo]

Voila une version simplifiee (qui marche pas bien) ...

Un grand merci et à Mozilla aussi et ses outils de "debugging" javascript (c autre chose que le script debugger de cro$oft )
 
j'ai trouvé mon bug.  
En fait j'avais créé un objet Option pour mes options de menu et çà me provoquait une belle erreur "error : redeclaration of function Option".
J'ai donc renommé cet objet en MenuOption et là plus d'erreur.
 
Donc ce soir je corrige et mon menu fonctionnera aussi sous mozilla . Trop content D

Ah ? Tu as essayé la dernière version ?
 

Mais on s'en fout. C'est justement aux créateurs de sites de se baser sur les recommandations du W3C et pas à celles de Microsoft. Ainsi, TOUT LE MONDE peut avoir accès à l'information, alors que pour ton site en flash et javascript spécial IE, comme on n'a pas les spécifications, certains ne pourront pas y accéder.
 

Raisonnement à 2 balles. C'est celui d'un intégriste de Microsoft, bin oui quoi, ce serait tellement plus simple si tout le monde avait le même navigateur.
 

Bin oui, laissons les cons dans leur ignorance, laissons-leur croire que le seul navigateur internet qui existe est IE, on s'emmerdera moins comme ça. Après, on n'aura qu'à tous faire nos sites avec Word et les visiter avec IE, et tout le monde il sera beau et gentil.
 
Tiens, je te propose d'aller voir la beta version de mon nouveau site : http://jmouette.nerim.net/latex/
Pour faire ce genre de choses, j'ai suivi à la lettre les recommandations du W3C, et ça passe au validateur. Ça passe aussi avec konqueror, mozilla et galeon. Malheureusement pour toi, la seule technologie qui permet ça est le PNG transparent, adopté par le W3C il y a plus de 5 ans, et pourtant toujours pas implémentée sous IE et Opera.