11550 sujets

JavaScript, DOM et API Web HTML5

Deplier / replier article html dans agora

Bonjour à tous,

J'aimerais savoir si quelqu'un pourrait me conseiller concernant un article html dans agora (agora-project) ?
je souhaiterais mettre en place un article ou je pourrais deplier et replier l'article (quand il y a plusieurs articles ou titre) si je clique sur ( ... ) par exemple
exemple
1 - TITRE 1
aaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaa ( ... ) <--- deplie et replie (sur la meme page)

2 - TITRE 2
bbbbbbbbbbbbbbbbbbbbbb
bbbbbbbbbbbbbbbbbbbbbb
bbbbbbbbbbb ( ... )

Etc ....

Me suis je correctement exprimé ?

Je vous remercie par avance

Merci
Bonjour,

Je ne connais pas agora ; mais pour ton problème, il suffit de mettre en place un simple système de montrer/cacher en JavaScript.
Modifié par Laurie-Anne (11 Jul 2011 - 13:28)
Bonjour Anne-Laure,

Merci pour ta réponse.

Pour les articles, je peut les ajouter en integrant le code HTML directement ou bien un copier coller
Par la suite, je ne suis pas trés callé pour insérer du code javascript dans Html...

Que me conseillerais tu ?

encore merci pour ton aide,
et pour toute aide
Bonjour à toutes et à tous,

voici une réponse à ta question : 
<!doctype html>
<html>
<head>
<title>test</title>
<script type="text/javascript">
function flipflop(id)
{
	if (document.getElementById(id).style.display == "none")
			document.getElementById(id).style.display = "block";
	else	document.getElementById(id).style.display = "none";
}

</script>
<style type="text/css">
#header {
        background-color    : lightblue;
}

#bouton {
        background-color	: lightyellow;
        width				: 100px;
        height				: 30px;

        margin				: 30px;
        border				: 1px solid yellow;
		padding				: 10px;
        text-align			: center;
}

</style>
</head>

<body>
<div id="bouton" onclick="flipflop('header');">bouton</div>

<div id="header">bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</div>
</body>
</html>
@+
Sujet clos
Aller à