Salut.

Problème à mon avis déjà rencontré par certains d'entre vous puisque ce genre de chose est à la mode; en fait j'ai fait plusieurs "boites" de messages (dernières news, derniers messages du livre d'or etc) et je m'étais dit un peu plus ergonomique et joli, de pouvoir permettre d'afficher masquer ces boites là.

J'avais déjà fait ce genre de chose mais sur des ID, or ici je ne sais pas le nombre de div que j'aurai, et chacune peut être masquée.

J'avais trouvé un script qui marchait sur une div, tout content j'essaye en mettant 2 div et... elles se masquent en même temps xP (et m...iaou pour rester poli xD).

Bref, avez vous un moyen de cacher l'élément sur lequel on a cliqué et non tout les éléments appartenant à cette class (ce qui est légèrement différent quand même ^^) ?

Je vous fous le script que j'avais trouvé (honte à moi, il était pas si compliqué finalement xD) :

http://wall.deblan.fr/x130f/javascript/1/

NB: En gros si j'ai bien compris, il recherche toutes les classes, les fout dans un tableau, et puis changent leur propriété CSS display, ce qui me manque ce n'est pas de faire un tableau de tout les éléments, mais bien l'élément sur lequel on a cliqué. ^^

Merci d'avance.

Salut à toi!

Je te conseille fortement de te tourner vers jquery pour cela.
En gros: une fonction each() te permettra de retrouver tous les divs sur lesquels tu veux appliquer cet effet (via leur classe).
Ensuite il te suffira d'utiliser deux fonctions (show et hide) pour afficher ou cacher le contenu.

Plus d'infos sur jQuery: http://jquery.developpeur-web2.com/

Pas toujours besoin de se cogner jquery (ou dans le genre) pour faire ça
http://bordel.deblan.fr/html5/hiddenClass.html

Ah merde, j'ai pas lu, quel boulet.

var hideMe = function(me) {
me.style.display = none;
}

Tu reprends mes fonctions getId et addEvent puis tu fais :

addEvent(window, 'load', function() {
addEvent(getId('foo'), 'click', function() {
hideMe(getId('foo'));
});
}

<div id="foo">Clique sur moi pour me cacher</div>

ou tu vires :

addEvent(window, 'load', function() {
addEvent(getId('foo'), 'click', function() {
hideMe(getId('foo'));
});
}

et tu modifies le div :

<div onclick="hideMe(this)">Clique sur moi pour me cacher</div>

Déso du petit remontage de topic, mais je bute sur un problème tout con.

Voilà j'ai finalement utilisé JQuery, et ça le fait bien avec le petit effet slide. xP

Par contre je bute sur une vraie connerie; j'ouvre une div en cliquant sur le contenu, mais j'aimerais la cacher quand je reclique sur le lien.

En javascript ça donnerait un truc du genre:

if(document.getElementById(champ_cache).style.
display == "block") {

document.getElementById(champ_cache).style.di
splay = "none";
}
else {

document.getElementById(champ_cache).style.di
splay = "block";
}

Le seul problème qui m'énerve, c'est que je ne parviens pas à déterminter si la boîte COURANTE est cachée ou pas (j'ai bien tenté la proprieté .css() etc mais rien n'y fait XD).

Le code jQuery (y a 5 lignes donc bon, je le fou ici ^^) :

$('div.accordionButton').click(function()
{

if($(this).siblings("div.accordionContent").show()
)
{

$(this).siblings("div.accordionContent").slideDown
();
}
else

{ $(this).siblings("div.accordionContent").slideU
p();
}
}

NB: En fait il y a 2 div (div titre, et div contenu), et c'est en cliquant sur le titre qu'on fait apparaitre le contenu, ou qu'on le cache).

Merci d'avance. ^^

utilise le toggle de jquery, exemple : $('#foo').toogle();

Snif, je pensais être arrivé au bout mais non... xD

toggle marche bien, seul soucis il s'agit de class donc je n'ai pas d'ID à envoyer, si je précise la classe il s'ouvre tous et se ferme tous, or je veux l'élément courant (et encore une fois, il y a une class titre et contenu, c'est le contenu qui doit se fermer, pas le titre sinon bonne chance pour réouvrir la div ^^).

$(this).('div.laclasse') faisait très bien ça, et là il tire la tronche avec toggle... (pourtant ça doit pas être bien compliqué à faire xP)

Yahou, trouvé !

$(this).next("div.accordionContent").slideToggle('
slideup');