Gerer une div en JS

eloyas -  
 __construct() -
Bonjour,

J'ai besoin de votre aide, je ne connais pas le JS, mais je crois qu'il est possible d'intergargir avec une div...

J'ai une div qui explique quelque chose..., mais je voudrais le voir seulement en cliquer dessus... Comme les balises de PHPBB un peu.

Si c'est possible en CSS (mais sans recharger la page ^^ ) sinon, quelqu'un aurai un script pour ma part, car apprendre le JS juste pour sa -_-

Merci d'avance.

Cordialement.

A voir également:

3 réponses

LaurentJ
 
Salut,
tu veux voir ta div en cliquant sur quoi??
0
magicshark Messages postés 402 Date d'inscription   Statut Membre Dernière intervention   13
 
ça ne sera pas perdu ça peut toujours servir fias une recerche sur le Getelmentbyid je pence que ça peut te servir apres j'suis loin d'être douer en js emais en attendant que tu es mieu ...
0
eloyas
 
Il clique sur un ouvrir par exemple, comme les balise secret un peu.
0
terryboggart
 
Si c'est possible en CSS
oui en plaçant la balise masquée et en lui donnant un affichage visible lors du survol (comme pour un lien en survol).
(propriétés display:none por masquer puis display:block pour l'afficher à nouveau, utiliser la pseudo classe :hover sur le div )

Js permet d'écrire du html, ou le réecrire, contraireement au css et html c'est un véritable lanagage de programmation(html & css= balisage) qui permet de gérer des événements(survol) et d'avoir des variables.
Donc commencer par regarder la syntaxe de base du javascript.
0
eloyas
 
C'est sa le problème, c'est que je voudrais que se soit au clique ... et non au survol, mais le tout sans recharger la page en entière...
0
__construct()
 
Bonsoir,
Fonction javascript :
function visibilite() {
	var targetElement = document.getElementById('notice');
	if(targetElement.style.display == 'none') {
		targetElement.style.display = '';
	} else {
		targetElement.style.display = 'none';
	}
}

Code HTML :
<p><a href="javascript:visibilite('notice');">Afficher/Masquer la notice</a></p>
<div id="notice" style="display: none;">
<p>Lorem ipsum dolor sit amet...</p>
</div>
0