+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : Menu hover et masquage (jQuery) (/showthread.php?tid=7818)
Menu hover et masquage (jQuery) - MeTaLLiQuE - 02-09-2017
Hello,
Cela fait des heures que je bosse sur le sujet mais... Je n'arrive pas à faire un truc qui est sûrement simple à réaliser...
Actuellement je passe sur un menu, ça m'ouvre une fenêtre (assez banale) MAIS ce que j'ai dû mal à faire c'est :
Vérifier que le joueur quitte bien le survol du lien du menu pour aller sur la fenêtre qui s'est ouvert (grâce au survol du lien du menu)
SI c'est n'est PAS le cas, on ferme la fenêtre qui s'est ouvert
Genre un truc comme ça...
Code :
// On attend qu'on sort du lien du menu
$('.bt_troupes').on('mouseleave', function(){
// Si on ne va pas directement sur le cadre qui s'est ouvert on ferme ledit cadre
if(!$('.cadre_troupes').on('quelle fonction ?!'))
$('.cadre_troupes').hide();
});Merci d'avance,
RE: Code jQuery - Xenos - 02-09-2017
Salut,
tu pars sur une mauvaise réflexion dans cette implé: ne cherches pas à faire du "si je quitte tel truc pour aller sur tel autre" car les transitions, c'est ingérable. Fais-le soit simplement en CSS (element:hover ~ .sibling-to-show { display: block; }) qui me semble simple et adaptable pour d'autres supports sans souris, soit un event listener mouseenter (ou mouseover?...) sur le body, qui ferme le menu, et un event listener mouseenter (ou mouseover?...) sur le menu qui stoppe la propagation de cet élément.
Note que je n'aime pas trop les menus hover: d'un point de vue utilisabilité, je ne les trouve pas terribles. Pour les tactiles, c'est mort et pour peu qu'un seul petit pixel d'écart se place au mauvais endroit, le menu devient inutilisable (je sais: j'en ai sur le blog https://toile.reinom.com mais je les trouve acceptable, d'une part parce que je n'ai pas envie de changer le thème, mais surtout parce que le click sur le bouton de menu survolable fait arriver sur une page qui contient les mêmes sous-menu que le survol: le survol n'est alors qu'un raccourcis pour accéder aux sous-menus, et non pas un passage obligé).
Note aussi que jQuery, à part rajouter de la lourdeur et freiner les dev dans la curiosité de "quelles API javascript sont sorties ces derniers temps?" ne sert pas à grand chose... document.querySelector('.br_troupes').addEventListener('mouseleave', e => { ... }) ne recourt à aucune lib
Note enfin que j'ai éditer le titre, pour en trouver un plus clair.
RE: Menu hover et masquage (jQuery) - MeTaLLiQuE - 03-09-2017
Salut,
Merci ! Bon j’abandonne l’idée :p
Je vais voir pour les querySelector and co pour supprimer au max les libs jQuery
Merci pour le titre lol je ne savais pas quoi mettre