webleads-tracker

class CSS pour le menu

Hélène
Bonjour,

J'aimerai savoir si il est possible de définir une class CSS pour le menu dans izi-media (comme c'est le cas dans e-majine).

En détail : l'idée de mon client est de mettre de couleur différente le texte d'un des boutons du menu. (par ex : tous les liens du menu sont blanc et un reste toujours rouge).

Merci à ceux qui auraient déjà eu le cas de me faire par le leur expérience !


Romain Sauger
Salut,

je me suis déjà confronté à cela. C'est d'ailleurs une bonne suggestion d'évolution puisque l'on peut attribuer une class CSS à la page, pourquoi ne pas la reprendre automatiquement dans le menu plutôt que de mettre des class="defaultmenu"...

Bref... la solution !

en CSS il y a moyen mais çà ne marche pas sur tous les navigateurs, donc en JQuery, ce sera plus simple :

Tout dépend de ce que tu veux faire PRECISEMENT :

pour appliquer une class à TOUS les onglets, au delà du 4ème par exemple :
$(".first_level li:gt(3)").addClass('maClasse');
(il y a un 3 parceque 3 çà fait 4 quand on part de 0)

pour appliquer une class à UN onglet, le 4ème par exemple :
$(".first_level li:eq(3)").addClass('maClasse');




Hélène
Merci Romain pour ta réponse.

J'ai testé ta solution en JQUERY pour appliquer une class à UN onglet.
Malheureusement ca ne fonctionne pas... Je fais (grâce à toi) mes premiers pas en JQUERY, peut-être y a-t-il une étape que je n'ai pas compris...

Voila ce que j'ai fait :

- j'ai installé jquery-1.4.2.min.js sur le serveur (dans html>modeles>fr>Modele1>structure)

- dans mainPage.html j'ai appelé mon script dans le HEAD:
script type="text/javascript" src="jquery-1.4.2.min.js"> script type="text/javascript">
$(".first_level li:eq(3)").addClass('menujaune');

(avec les balises correctement ouvertes et les balises de /script également mais je n'arrive pas à les faire apparaitre dans mon texte sur le forum)


- dans ma feuille de style j'ai créé ma class :
.menujaune #nested .first_level a span {
background:transparent none no-repeat scroll 0 55%;
font-weight:bold;
padding:8px 0 0;
color:yellow;
}


Merci d'avance à toi et aux utilisateurs avertis de JQUERY.
Bonne journée



Romain Sauger
Salut,

alors on va reprendre certains points depuis le début ;)

Si tu veux installer Jquery sur ton site (et c'est valable pour tous les fichiers javascript) tu dois les ranger dans /scripts/ à la racine du site. Ce qui nous donne dans HEAD src="/scripts/jquery-1.4.2.min.js".

ATTENTION : méfie-toi quand même avec JQUERY si tu l'ajoutes toi-même dans ton site IZI-MEDIA : JQuery est DEJA intégré. Donc normalement tu n'as pas besoin de faire cette manip.

La seule raison de l'intégrer soit-même, c'est d'avoir besoin d'une autre version que celle installée par défaut sur le site... Dasn ce cas, il faut bien l'intégrer APRES la balise MX:HEAD.

Il y a un fil sur ce sujet ici : http://communaute.medialibs.com/forum/topic-1898.html


Ensuite, en Jquery, il faut toujours commencé par çà (il y a des variantes...):
$(document).ready(function() {
//ici ton code
});

ce qui nous donne pour notre exemple :

$(document).ready(function() {
$(".first_level li:eq(3)").addClass('menujaune');
});

Enfin, en ce qui concerne ta CSS, çà donne plutôt çà :

#nested .first_level .menujaune a span

Bon courage :-)

Hélène
AAAHHHHH !!!! Ça fonctionne ! Merci Romain !

Pour info, je n'ai pas eu besoin d'ajouter "jquery-1.4.2.min.js" dans le dossier script de mon site izi-media.

Je ne connaissais pas JQUERY mais je crois que vu les possibilités, je vais regarder ça de plus prêt !

A bientôt :-)