Un autre genre de menu déroulant
A bon entendeur...
Vous avez déjà un tuto pour un menu déroulant que j'ai rédigé ICI qui vous permettra d'obtenir le résultat visible ci-contre dans la colonne de gauche, illustrer par notre rubrique "archives".
Ce tuto est lui consacré à un deuxième type de menu déroulant que vous pouvez apprécié en cliquant sur le mot "translation" toujours visible dans la colonne de gauche. Comme vous pouvez le constatez si vous cliquez dessus le petit moteur de traduction apparait et que même si on re-clique il disparait... Avouez qu'il n'est pas utile de l'avoir à demeure visible sur le blog...
Alors pour obtenir ce résultat...
Le code a insérer dans vos pages est le suivant :
<!-- Bloc 1 TRADUCTEUR --> <------ Nommez votre bloc surtout si vous envisagez d'en mettre plusieurs
<script type="text/javascript">
function showhide(blocid) {
var monbloc1= document.getElementById(blocid);
if (!monbloc1) return;
monbloc1.style.display = (monbloc1.style.display=="none" ) ? "block" : "none";
}
</script>
<p class="bloclien1"><a onclick="showhide('monblocdelien1')">
<div class="title">TITRE DE VOTRE BLOC DE LIENS</div></a></p>
<div id="monblocdelien1" style="display: none;">
<--- là c'est le code que vous souhaitez caché/montré en ajoutant <ul> en début et </UL> en fin
</div>
<!-- fin Bloc 1 -->
NB : Vous pouvez bien sûr mettre plusieurs liens à l'intérieur d'un bloc, exemple : tous les code de vos référencement
Vous pouvez également enchainer les blocs exemple : un blocs avec tous vos liens amis, un blocs avec tous vos référencements, un bloc "abonnement au blog"... dans ce cas partout où le chiffre 1 apparait (je l'ai mis en bleu pour que vous voyez, vous devrez renommer par 2, puis 3...). Attention, si vous en ratez un seul ça marche pas!
Un exemple concret en image sur mon blog dans ma colonne de droite (c'est pas de la pub, hein? Juste que des fois des images c'est plus parlant qu'un long discours!). Vous pourrez apprécier toutes les possibilités de ce bel outil.
Soyez très vigilant sur les codes sinon bug assuré. Il y a du vécu là...
Allez bon nettoyage de printemps!
Ce tuto vous est offert par Clochette93 - Merci à elle!