Flux rss
Collection CommentCaMarche.net
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Non résolu

Problème Fancy Menu avec Mootools

  Manatee, le lundi 14 avril 2008 à 12:07:06
Bonjour,

J'ai un soucis avec un Fancy Menu qui fonctionne avec Mootools, je l'ai fait en suivant ce tutoriel [url="http://devthought.com/cssjavascript-true-power-fancy-menu/"]http://devthought.com/cssjavascript-true-power-fancy-menu//url .

Au début j'avais un problème car les liens étaient cliquable mais ne fonctionné pas.

Pour résoudre le problème j'ai changé ce code :

window.addEvent('domready', function() {
new SlideList($E('ul', 'fancymenu'), {transition: Fx.Transitions.backOut, duration: 700, onClick: function(ev, item) { ev.stop(); }});
});

Par celui ci :

window.addEvent('domready', function() {
// orange menu demo
if($('fancymenu'))
FancyExample = new SlideList($E('ul', 'fancymenu'), {transition: Fx.Transitions.backOut, duration: 700});
});

Maintenant les liens fonctionnent parfaitement mais le "background" reste toujours derrière le liens accueil et je n'arrive pas a trouver de solution, alors si quelqu'un peut m'aider ça serait bien gentil.

Voilà le code complet :

menu.js
var SlideList = new Class({
initialize: function(menu, options) {
this.setOptions(this.getOptions(), options);
this.menu = $(menu), this.current = this.menu.getElement('li.current');
this.menu.getElements('li').each(function(item){
item.addEvent('mouseover', function(){ this.moveBg(item); }.bind(this));
item.addEvent('mouseout', function(){ this.moveBg(this.current); }.bind(this));
item.addEvent('click', function(event){ this.clickItem(event, item); }.bind(this));
}.bind(this));

this.back = new Element('li').addClass('background').adopt(new Element('div').addClass('left')).injectInside(this.menu);
this.back.fx = this.back.effects(this.options);
if(this.current) this.setCurrent(this.current);
},

setCurrent: function(el, effect){
this.back.setStyles({left: (el.offsetLeft)+'px', width: (el.offsetWidth)+'px'});
(effect) ? this.back.effect('opacity').set(0).start(1) : this.back.setOpacity(1);
this.current = el;
},

getOptions: function(){
return {
transition: Fx.Transitions.sineInOut,
duration: 500, wait: false,
onClick: Class.empty
};
},

clickItem: function(event, item) {
if(!this.current) this.setCurrent(item, true);
this.current = item;
this.options.onClick(new Event(event), item);
},

moveBg: function(to) {
if(!this.current) return;
this.back.fx.custom({
left: [this.back.offsetLeft, to.offsetLeft],
width: [this.back.offsetWidth, to.offsetWidth]
});
}
});

SlideList.implement(new Options);

main.js
window.addEvent('domready', function() {
// orange menu demo
if($('fancymenu'))
FancyExample = new SlideList($E('ul', 'fancymenu'), {transition: Fx.Transitions.backOut, duration: 700});
});



Merci d'avance !
Configuration: Windows XP
Firefox 2.0.0.13
Répondre à Manatee  Signaler ce message aux modérateurs
Javascript : Menu dynamique Mootools (Résolu) Bonjour, Je travail actuellement sur un site web. Le contenu de ce site est totalement dynamique. Il permet notamment la création d'un menu avec de catégories et rubriques (équivalent menu & sous-menu) récupéré dans la base de donnée. Je souhaite... www.commentcamarche.net/forum/affich-9246169-javascript-menu-dynamique-mootools
Ajouter un raccourci dans le menu contextuel du poste de travail Qui n'a jamais rêvé de pouvoir avoir accès en un seul clic à certaines commandes enfouies dans les menus déroulants du système ? Problématique Imaginons que nous voulions aller dans la fenêtre de gestion de l'ordinateur. 2... www.commentcamarche.net/faq/sujet-5359-ajouter-un-raccourci-dans-le-menu-contextuel-du-poste-de-travail
[Vista] Afficher la commande Exécuter du menu Démarrer Afficher la commande "Exécuter" du menu Démarrer Lors de l'acquisition de votre nouveau système d'exploitation Vista, vous vous apercevrez que la commande "Exécuter", qui est assez coutumière et serviable chez son petit frère XP, n'existe... www.commentcamarche.net/faq/sujet-6987-vista-afficher-la-commande-executer-du-menu-demarrer
Editer le menu contextuel de Nautilus (navigateur de fichiers)Il est facile d'ajouter des éléments dans le menu clic-droit de Nautilus (l'explorateur de fichiers d'Ubuntu). Il existe deux méthodes: avec nautilus-action avec nautilus-scripts Chacun a ses avantages: Les plus de nautilus... www.commentcamarche.net/faq/sujet-6357-editer-le-menu-contextuel-de-nautilus-navigateur-de-fichiers
Xubuntu: Modifier le menu "Applications"Modifier le menu application de Xubuntu Contrairement à Ubuntu, Xubuntu ne possède pas d'éditeur de menu. Le seul moyen d'éditer le menu est d'aller modifier des fichiers texte à la main. Pour cela, ouvrez un terminal (n'utilisez pas le... www.commentcamarche.net/faq/sujet-6477-xubuntu-modifier-le-menu-applications
[Word] Menus, outils qui ont disparuProblème : “plus aucun menu ni aucune barre d'outils (comme si il était en mode plein écran sauf que là je ne sais plus le remettre en normal, la touche Esc prévue pour cela ne fait rien à l'affaire)” Solution : “Lancer la commande... www.commentcamarche.net/faq/sujet-2994-word-menus-outils-qui-ont-disparu
Création de menus et de carte d'invitations (Résolu)Bonjour, je suis à la recherche d'un logiciel me permettant de creer des menus (pour noel) et des cartes d'invitations (pour noel également) www.commentcamarche.net/forum/affich-3952672-creation-de-menus-et-de-carte-d-invitations
[XP] barre de menu comme sous Mac (Résolu)Bonjour, Voilà je suis sous Windows XP et j'aimerais pouvoir installer une barre de menu comme sous Mac, c'est à dire une barre de menu qui se trouve en haut de l'ecran. Je sais que c'est possible d'avoir la même chose sous... www.commentcamarche.net/forum/affich-2650646-xp-barre-de-menu-comme-sous-mac
Tutos complets sur flash 8 pour créer menu ? (Résolu)Bonjour à toutes et à tous, Voila mon problème, j'ai besoin de créer un menu qui se déroule quand je passe la souris sur un bouton (ou une image) et qu'il se repli lorsque je sors du menu. mon deuxième soucis est que je souhaiterai que le... www.commentcamarche.net/forum/affich-2841568-tutos-complets-sur-flash-8-pour-creer-menu
Télécharger Menu InventorEn dehors du fait que le démarrage de votre ordinateur se trouve lent et chaotique, en plus l'organisation des menus n'est pas comme vous l'aurez voulu. Menu Inventor est la solution pour accélérer le démarrage de votre ordinateur mais aussi pour... www.commentcamarche.net/telecharger/telecharger-34056268-menu-inventor