[TUTO] Présentation d'un nouveau Design vertical menuHoverShow avec paramétrage par fichier JSON

Tags: #<Tag:0x00007f2428dd9ca0>

Bonjour,

Je vous présente un nouveau menu Design.
C’est un menu vertical paramétrable depuis un fichier JSON (déclaration des boutons, définition des couleurs). Il n’est donc plus nécessaire de modifier le code.

Il a la particularité de présenter 2 menus idépendants (un en haut et un en bas)

Une démonstration est visible ici :

L’installation détaillée et le code est accessible ici :

4 J'aimes

Merci @noodom !

Avec plaisir ! :blush:

Je regarderai pour ajouter la gestion par frame comme j’ai pu le faire pour les autres menus disponibles :

Bonjour @noodom,
Merci pour ce menu

Je l’ai installé.

Par contre est il possible d’avoir des icon de type image, un lien « link »: « https://www…/ » (comme par exemple dans le menuFlyOut que tu as fait)

Merci
Philippe

Salut,

Pourquoi pas, oui :slight_smile: Par contre, je ne sais pas dire quand dans l’immédiat.

Bonsoir, me voila nouveau ici, et déjà besoin d’un peu d’aide.

J’ai suivi la procédure pour avoir le menu en Iframe, hors au final je n’ai qu’un affichage « chargement du menu… »

J’ai du louper un truc, mais déjà je n’ai pas su trouvé comment télécharger les fichiers directement ?!

Merci, bonne soirée.

Salut,

Tu as bien ajouté la frame contenu AVANT la frame menu ?

Sinon depuis ton design principal qui contient tes frames, si tu regardes la configuration avec un clic droit, tu retrouves bien tes 2 frames dans les composants ?

1 J'aime

Salut, alors, j’ai tout repris du début, maintenant, j’ai bien le menu qui s’affiche et qui me permet de naviguer de page en page mais plusieurs soucis.
j’ai l’icone de Jeedom avec au-dessus une case que je peux m’amuser a cocher .
il y a comme une sorte de superposition de 2 pages de design
Via fullykiosk sur mon téléphone je ne peux pas naviguer sur les différentes pages.
J’essaye de faire des screens.

Merci pour l’aide

Mi9Tproiframe - Jeedom - Google Chrome

avec fullykiosk sur mon tel, j’ai bien le menu, mais aucun équipement sur la page d’accueil et impossible de cliquer sur une autre page de menu

Pour fullykiosk, je ne pourrai pas t’aider, je n’utilise pas du tout et je vois passer divers problèmes avec… je n’en connais pas les particularités.

Pour la case à cocher, je ne vois pas trop (pb de css ?)
C’est le comportement depuis le PC ?

Sinon Tu as quel taille de design ? Et tu as positionné le menu à quel position ?

EDIT : A voir le rendu tu sembles avoir un problème de css. Tu l’as mis au bon endroit ? Tu peux vérifier ?
Sinon fais F12 pour ouvrir le debugger, ouvre la console et recharge la page. Tu dois avoir une erreur de récupération du fichier css qui apparaît.

Salut, Pour la case a cocher je l’ai sur le pc des que j’intègre le menu.
Pour la taille du design je suis en 393x851 pour mon téléphone.

Pour le css il est ici: html/montheme/menuVerticalTom/css/perso.css

je voie ceci aussi: |Permissions :|Lecture et Écriture|
| — | — |
|Verrouiller :|non|
|md5 :|NetworkError: Failed to execute ‹ importScripts › on ‹ WorkerGlobalScope ›: The script at ‹ https://********dns5.jeedom.com/js/worker/calcfilehash.js › failed to load.|
|sha256 :|NetworkError: Failed to execute ‹ importScripts › on ‹ WorkerGlobalScope ›: The script at ‹ https://*******.dns5.jeedom.com/js/worker/calcfilehash.js › failed to load.|

Merci pour ton aide

Je pense que taille de ton design est trop petite.
Essaie (pour test) de mettre par exemple 1280x1000 et regarde le résultat d’affichage.

Pour les erreurs de permissions, je ne saurais pas te dire à quoi c’est dû et si ça a un lien avec ton problème.

Salut, merci, j’ai bien changé la taille comme tu me l’as conseillé, cela fonctionne sauf la petite case a coché toujours présente, mais du coup si je veux adapter le design a mon téléphone?

Édit: Finalement j’ai réussi, il me reste juste la case , j’arrive pas a savoir d’où elle viens

La case à cocher est là pour la gestion du menu mais n’est pas censée être visible.
elle est toujours visible, même en version design avec taille et largeur suffisamment grande sur PC ?

oui toujours visible quelque soit la taille

@greg62 je te propose de continuer sur le post suivant que je viens de créer pour le menu menuVerticalTom car ce post est plutôt réservé au menu menuHoverShow à la base :slight_smile: Ce sera plus clair pour tous.

Merci.

1 J'aime

Merci :slight_smile:

Bonjour,

J’adore ton menu menuHoverShow et sa sobriété colle très bien avec ce que je souhaite faire (en modifiant légèrement certaines couleurs javoue :smiley:).
J’ai juste une petite question qui va te sembler bizarre… mais comme j’y connais rien, je n’arrive pas à trouver tout seul. J’aurais aimé supprimer l’effet de déploiement du menu, qu’il soit toujours en version large et qu’il ne se réduise pas en mode icône. Tu vas me dire, ça dénature un peu ce que tu as fait, mais pour mon usage perso ça serait plus pratique.

Ce serait possible que tu m’oriente pour savoir à quel endroit je peux désactiver cette fonction ? :slight_smile:

Merci

Salut,

Essaie en modifiant le fichier perso.css de la façon suivante :

width:var(--menu-width);
--overflow:hidden;

image