Amelioration du menu buble de Noodom ? Fond Flouté ou assombrit

Hello a tous, j’ai intégré le menu Bubble de @noodom à mes designs mais il manque une seule chose pour qu’il soit parfait le fond assombrit ou mieux flouté lorsque le menu est déployé.
de même je pense qu’il faut dans le mécanisme de sélection que le menu se replie lorsqu’un choix est cliqué.
Est ce que le grand maître du menu ou un Jss/CSS Maniac qui passerait par la serai capable de faire ca ?

Pour rappel je ne trouve plus le git sur lequel il serait mais l’installation était très bien documentée ici sur un article de « ma maison intelligente »

Salut,

Tu parles sans doute de ce menu : [TUTO noodom] Présentation d'un nouveau Design vertical menuVerticalTom avec paramétrage par fichier JSON et navigation par FRAME

Il se replie déjà sur sélection avec l’option auto_reduce_menu (je l’ajouterai dans la documentation de mon Github) :

A voir ce qui est possible pour le floutage du fond, je verrai pour faire quelques tests. J’ai une petite idée comment faire, à creuser/valider.

Par contre, pour l’installation et le développement, il n’y a aucun lien avec le menu que tu cites.
D’ailleurs, pour une installation au plus simple (une ligne de code à copier-coller dans un scénario, un peu de paramétrage pour personnaliser ton menu), tout est détaillé ici :

Alors non je parlais de celui la , encore plus simple mais assez proche de celui que tu decris. ( je vais d’ailleurs de ce pas les faire se ressembler )
menububble-64ff36a97ee1b

Si tu arrives a ce floutage, je replace tout mes menus par ça, tellement plus simple, facile à mettre en place ( même menu sur une vue portrait / paysage,) intuitif sur un portable. Bref : le kiffe ultime.

1 « J'aime »
  • ajout d’un paramètre opened_menu_opacity pour choisir un pourcentage d’opacité du contenu de la page lorsque le menu est ouvert

  • mise à jour de la documentation sous github pour les paramètres init_close_menu, auto_reduce_menu, opened_menu_opacity
    - init_close_menu : menu fermé au lancement du menu (par défaut « 1 »)
    - auto_reduce_menu : menu se ferme sur sélection d’un bouton (par défaut « 1 »)
    - opened_menu_opacity : (par défaut « 20% »)

1 « J'aime »

La brute !, je teste asap

Edit , c’est Top ! exactement ce qu’il faut.
J’abuse une dernière fois en te demandant comment utiliser des icônes ( Fonts awesome par ex. ) au lieu des Png . et j’arrete de t’embeter. ( je demande pour les icônes car c’est moi lourd que des Pngs et surtout modifiable a souhait pour ceux qui ne sont pas loltoshop addict.) .

D’ailleurs je me tate a faire un tuto très simple sur « tinypng » qui permet d’alléger considérablement les pages jeedom en optimisant les png de façon automatique.

Je posterai les captures de menu

A voir pour les fontawesome, la demande a déjà dû être faite de mémoire, mais il faut valider le rendu en plus du chargement.
J’avais déjà dû gérer la possibilité de choisir des images ou des fontawesome dans certains de mes menus, faut que je retrouve ça.

Integré !


Parfait, tu as finalement pu ajouter les fontawesome.
Je n’ai pas eu le temps d’aller jeter un œil pour l’intégrer directement dans le menu, au niveau de la lecture du fichier de configuration perso.json.

Le rendu du menu avec le fond flouté lorsqu’il est ouvert était une bonne proposition, merci ! :wink:

1 « J'aime »

Font awesome oui mais j’ai triché, ce sont des png :slight_smile:

Hello petit retour sur l’utilisation du menu !
Il y a un soucis : ce qu’il y a sous le menu n’est pas cliquable. En gros tout la zone de dépliage.
Y a t’il une manip avec les niveaux à faire ?

Edit : une capture d’écran
Bug-Zone
pour préciser

Salut,

C’est en effet le comportement normal dû à la superposition des frames menu et contenu.

Il y aurait sans doute moyen de supprimer cette limitation comme je l’ai fait pour mon dernier menu nooMobileFlip. J’ai prévu de me pencher dessus mais ça fait quelques menus à revoir :sweat_smile:

En effet ce serait top dans le sens où le menu dépliant prend tout son sens s’il y a quelque chose derrière lorsqu’il est replié :slight_smile:

Tout mes espoirs sont tournés vers toi !
(surtout que j’ai fini tout mes menus avant de me rendre compte que je ne pouvais pas cliquer sur les éléments derrière :slight_smile: :slight_smile: :slight_smile:

en faisant deux trois recherches je suis tombé sur un codepen qui ressemble beaucoup au menu Ici ( sur jeedom community ) et qui a été intégré mais sans l’iframe et ton super menu scenario.
Bon en tout cas je suis la pour tester si tu as besoin
++

Salut,

La modification du menu pour l’accès à la sélection des éléments derrière le menu est en bonne voie !

menuOneFrame

Mais j’ai dû revoir le scénario de génération automatique de menu pour prendre en compte des modifications de fond (suppression d’une frame) et il va falloir que je fasse quelques tests pour valider toutes ces modifications (menu modifié et génération de menus)

1 « J'aime »

rahhhhhh vicieux que tu es , tu nous montres que tu as trouvé la solution et nous laisse languir avec nos menus :wink:
Bien joué en tout cas , j’ai hâte de pouvoir remplacer le mien.
Si tu as le code que je puisse remplacer sans lancer la régénération d’un menu je suis preneur !
Bien joué en tout cas

Salut,

Désolé, j’étais pas très dispos ces deniers temps.
Je fais au mieux pour rendre dispos tout ça.

Comme je te disais, j’ai adapté un peu la procédure pour améliorer la conception du menu et du scénario de génération des menus et je préférais prendre du temps pour tester.

Je te tiens au courant au plus vite😉

Salut,

Message privé avec le contenu modifié pour test. Bon courage :wink: