-
Module menu contenu caché déroulant survol souris sur le titre
Afin de réduire la hauteur de votre menu latéral, il s'agit de cacher le contenu de chaque module de menu et au passge de la souris sur le titre du module, le contenu se déroule.
Une fois le menu latéral constitué avec les outils de l'interface eklablog ( /!\ ici, le menu sur la gauche de l'article est factice, pour vous montrer le rendu mais les liens ne mènent nulle part !),
A - clic droit souris sur le titre d'un module:
Pour exemple ici, clic sur "module de liens".Dans la fenêtre -de dialogue du navigateur- qui s'ouvre, clic sur "examiner l'élément".
Dans le bas de la page, s'affiche sur fond blanc le code html de la page avec la ligne concernant le module en sélectionné/surligné.
Ainsi, on repère le module de liens et son numéro;
Dans notre exemple, module_menu144577288Comme il s'agit d'un id, son sélecteur (pour appliquer du CSS) sera:
#module_menu144577288
Nous voilà donc en possession du sélecteur qui va nous permettre d'appliquer un style bien particulier à notre module de menu "module de liens"" !
B - Il nous faut connaitre la hauteur des titres de nos modules ( à retrouver dans "modifier le thème" >> >"menu 1 ou 2" >> "titre module" > format.
Ici, les titres font 60px de haut.
Le principe:
Nous allons ajouter un CSS qui affiche le module avec une hauteur de 60px, la hauteur du titre;
Puis un CSS qui affiche le module de sa réelle hauteur au survol du titre avec la souris:/*effet Module de liens*/
#module_menu144577288 {
overflow: hidden;
height: 62px; /*60px etant la hauteur du titre du module*/
-webkit-transition: all 1.5s ease 0.15s;
-moz-transition: all 1.5s ease 0.15s;
transition: all 1.5s ease 0.15s; }#module_menu144577288:hover {
height:218px; /*hauteur du module en entier*/}/*FIN effet module de liens*/
C - On renouvelle la procédure pour chaque module du menu: module "derniers articles":1- clic droit sur titre2-Récupérer id du module module_menu1445772903- ajouter CSS adapté aux dimensions titre, hauteur module entier/*effet Module derniers articles*/
#module_menu144577290 {
overflow: hidden;
height: 62px; /*60px etant la hauteur du titre du module*/
-webkit-transition: all 1.5s ease 0.15s;
-moz-transition: all 1.5s ease 0.15s;
transition: all 1.5s ease 0.15s; }#module_menu144577290:hover {height:218px; /*hauteur du module en entier*/}
/*FIN effet module derniers articles*/
N'hésitez pas à intervenir par le biais des commentaires si vous rencontrez quelques difficultés....
« examiner un élément de la page et trouver son sélecteurPremière lettre de paragraphe // lettrine »
Tags : menu latéral, menu déroulant, bouton déroulant
-
Commentaires
(suite message)
Par contre j'ai retirée certaines fonction en haut, ce qui rend le blog plus clair.
Et est ce possible de rapprocher les catégories d'articles qui sont très espacées ?
Merci pour votre réponse qui je sais, me sera de grand secours.
Amitiés.
Bonjour Mamieninette,
Ici, ça va. C'est presque l'été au niveau des températures mais cela ne va surement pas durer..
Pour ajouter une image "blogs amis", on se retrouve sur cet article plutot
http://bloginscription.ek.la/module-avec-blogs-amis-a114984806 et tu m'expliques ce que tu fais et où cela bloque . Okay ?Et je voudrais aussi mettre une manette à des articles, mais comment ?
Tu voudrais aussi ajouter l'effet "barre de défilement" à d'autres modules de ton menu sur le coté ? c'est ça ? ou tu voudrais mettre la barre de défilement dans les articles eux-mêmes, pour qu'ils apparaissent en moins longs sur le blog ?
Que veux tu dire par "rapprocher les catégories un peu trop espacées" ? donne moi un exemple avec le titre, nom des catégories ou leur emplacement sur le blog...
Bonne journée
Bonjour Maximum,
Merci.Je vais y aller.
Pour les barres de défilement, c'est pour les autres modules : qui a connu çà ? les années 60, etc....
A tout de suite.
Bises.
Merci pour tes explications chez Maurice, mais je crois que je faisais ainsi, mais étourdie comme je suis, j'ai sans doute voulu aller trop vite !
Ton blog à l'air d'une mine d'or ! je garde ton lien en favoris !
Merci pour tout ce que tu partages
Je suis du sud dans le 06.......
Bonjour Monsieur,
Sauriez vous m'expliquer (pour une nulle !) comment mettre Windows 7 sur mon nouveau Pc, qui est sur Windows 8.1 ??
Je n'aime pas du tout ce 8... Peux t on revenir sur 7 ???
Mon autre PC est sur 7, du coup je me sers du vieux, plus facile pour moi........Mais c'est dommage puisque j'en ai un neuf..........
Merci si vous savez et pouvez me dire !
Je suis allé consulter des forums mais je ne comprends pas
ce qu'il raconte ( DD, BIOS, Drivers, etc )
Bonne soirée
Bonsoir,
Désolé Ghislaine, ton commentaire était passé aux oubliettes !
As-tu toujours le CD d'installation de windows 7 ?
(ou tu connais quelqu'un qui a gardé le sien)
car si tu n'as le CD windows 7, je ne vois pas trop comment tu pourrais faire pour le ré-installer à la place de windows 8.1
Bonjour Maximum 34,
Je reviens ici pour savoir comment gérer un flux RSS ? Peut on les retirer ?
Je m'aperçois qu'avec google, des choses paraissent et ne le voudrait pas.
Merci de ta réponse.
J'espère que tu vas bien et te souhaite une bonne journée.
Ajouter un commentaire
Bonjour,
J'espère que vous allez bien ?
Suite aux réponses que vous m'avez donnez pour ajouter des amis dans un bloc déroulant avec manette (ou bouton) je n'arrive pas. Et je voudrais aussi mettre une manette à des articles, mais comment ?
Merci pour la réponse.
En attendant, bonne journée à vous.