Si alarme activée ==> telle page du design

Merci de ta réponse et oui j’utilise ce menu en effet, je vais regarder de plus pret le plugin. Merci :grin:

Dans ce cas, tu vas voir, c’est cool.
Avant quand je faisais une modif sur le menu, il fallait que je repasse sur tous les designs pour faire le changement.
Maintenant, un design = un équipement que j’ai importé dans tous mes designs.
une modif est donc immédiatement appliquée sur tous les designs :wink:

Tellement plus pratique en effet :stuck_out_tongue_closed_eyes:
J’y regarde ce week-end :grin:

Je viens de tester html display pour les menus, c’est ouf comme c’est plus pratique, merci
Par contre de cette façon, comment gère tu l’icone sélectionné en fonction de la page, le ‹ selected › ?

Désolé, je n’utilise pas cette fonctionnalité.
Je ne sais pas comment faire.
Par contre, si tu trouves, je suis preneur :wink:

1 « J'aime »

Salut,

en javascript ça doit pouvoir se faire sans trop de difficultés dans l’idée parce que j’ai pas encore testé le plugin html display mais vous m’avez bien donné envie :slight_smile: :smiley:

Je sens que je vais l’essayer dès demain !!

Impec, dis moi si tu trouves pour le js, ça fait plus de 10 ans que j’ai pas codé :rofl:

Tu as testé depuis @Salvialf ? :stuck_out_tongue:

As tu trouvé comment gérer l’icone sélectionné en fonction de la page? :smiley:

Salut,

J’avais complètement oublié cette discussion (je me fais la main sur la POO en ce moment :wink: ).

J’essaye d’y jeter un œil ce week-end (j’ai mis un signet)

Impec merci, tiens moi au courant :slight_smile:

Salut,

Pourrais-tu déjà partager ce que tu as fait pour transformer l’utilisation de ce design (donc de plusieurs design différents) avec html display stp ?

Merci,

Bison

Salut, tu créé un équipement sous html display et dans le code tu mets le menu du design.

Après dans tes design tu as juste à ajouter un équipement et tu choisi celui que tu viens de créer dans html display

Merci @sikuland

Pas contre je viens de voir qu’il n’est pas dispo en V3 ce plugin ! Tant pis son utilisation attendra encore pour moi que je décide à tout reprendre en V4.

Ah ça je peux pas te dire, je suis en v4 :stuck_out_tongue_winking_eye:

Hello,

Bon c’était juste dans l’idée car j’ai dû me creuser la tête un peu quand même mais j’ai réussi à pondre une fonction javascript semble-t-il fonctionnelle si tu veux essayer:

super ça marche ton code :slight_smile: encore merci.

Par contre, je sais pas si c’est chez moi ou si c’est le code mais avant ton code j’ai ça

et après le code j’ai ça

y’aurait un moyen qu’une fois selectionné ça soit comme la première image et pas juste en opacité dessus ?

Je sais pas faudrait voir le code que tu utilises… par exemple tu n’aurais pas une classe selected ET une classe active dans ton fichier css ? …ou plusieurs fichiers css différents ?

La fonction javascript que j’ai ajouté ne fait rien d’autre que d’identifier la page du design en cours pour ajouter une classe css sur l’élément actif afin de le différencier visuellement… Cette classe ajoutée est présente dans le fichier CSS déjà ajouté au code du menu.

j’utilise le code css d’origine de F$B333 et je ne crois pas y avoir touché, chez toi ça réagi comme moi actuellement ou comme je voudrais que ça soit ?

div.menu_top
{
	width:1281px;
	height:70px;
	background-color:rgba(0,0,0,0.6);
	border-bottom:2px solid rgba(0,0,0,1);

}
ul.monmenu
{
	width:1281px;
   	margin: 0 auto;
}

ul.monmenu ul.monmenu_sep
{

	list-style-type:none;
	color:rgba(255,255,255,0.8);
	font-family:Roboto;
	font-size: 16px;
	font-weight: normal;
}

li.monmenu
{

	display:inline-block;
	width: 100px;
	margin-left: -5px;
	text-align: center;
	height: 70px;
	padding-top: 10px;
	border-left: 1px solid rgba(255,255,255,0.3);
	border-right: 1px solid rgba(255,255,255,0.3);
	background-color: rgba(0,0,0,0.2);
}

div.imagette
{

	text-align: center;
	margin-bottom: 5px;
	opacity: 0.3 ;

}

li.monmenu:hover{

	background-color: rgba(255,255,255,0.2);
}

li.selected{
	display:inline-block;
	width: 100px;
	margin-left: -5px;
	text-align: center;
	height: 70px;
	padding-top: 10px;
	border-left: 1px solid rgba(255,255,255,0.3);
	border-right: 1px solid rgba(255,255,255,0.3);
	background-color: rgba(255,255,255,0.2);
}

li.monmenu_sep
{

	display:inline-block;
	width: 100px;
	margin-left: -5px;
	text-align: center;
	height: 70px;
	padding-top: 10px;

	border-right: 1px solid rgba(0,0,0,0.3);

}

div.bouton{

	opacity: 1;

}

div.bouton:hover
{

	opacity: 0.5;
}

Merci @Salvialf, j’ai testé ton code et ça marche bien :+1: En revanche, j’ai la même remarque que @sikuland : l’icône active (selected) n’apparait plus avec une transparence nulle comme avant. Seul le cadre actif est en surbrillance.
Je pense que la classe « selected » devrait porter sur l’icone et non pas sur le cadre actif (dans le code initial de @F$B333 la classe passe de « imagette » à « selected »)

Je ne sais pas vous en êtes dans la discussion, mais pour avoir l’imagette opacity 1, il faut ajouter
$(planID+’ div’).addClass(‹ bouton ›);
en dessous de
$(planID+’ li’).addClass(‹ selected ›);

et la cela réagit comme initialement. (bon je le laisse mais cette soluce a été trouvé dans un autre poste par nitrogramme