Masquer/afficher paragraphe avec Javascpript
Gregorio
-
Reivax962 Messages postés 3672 Date d'inscription Statut Membre Dernière intervention -
Reivax962 Messages postés 3672 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
J'ai un petit problème lors de la création de mon site web
En fait, je suis entrain de créer un CV en ligne.
Donc, dans la catégorie des expériences professionnelles, je veux faire en sorte qu'on voit comme dans un CV papier, une succincte liste des jobs que j'ai eus, et qu'a coté il y ai un lien ou quelque chose du genre (image, etc... peu importe) qui indique "lire plus". Lorsqu'une personne clic sur ce lien, sans qu'on ai besoin de réactualiser la page, une description plus approfondie de l'emploi s'affiche.
J'ai fais beaucoup de recherche sur google, différents forums, etc... mais je comprend pas trop d'où vient mon erreur. Au début, je voulais faire ça en Php, mais j'ai vu sur internet qu'apparemment JS est plus adapté... mais je ne veux pas absolument du JS, si vous avez une solution qui marche sans, c'est parfait !
Je vous copie le code entier de ma page.
voila si quelqu'un pouvait me sortir de ce pétrin je lui en serais très reconnaissant !
J'ai un petit problème lors de la création de mon site web
En fait, je suis entrain de créer un CV en ligne.
Donc, dans la catégorie des expériences professionnelles, je veux faire en sorte qu'on voit comme dans un CV papier, une succincte liste des jobs que j'ai eus, et qu'a coté il y ai un lien ou quelque chose du genre (image, etc... peu importe) qui indique "lire plus". Lorsqu'une personne clic sur ce lien, sans qu'on ai besoin de réactualiser la page, une description plus approfondie de l'emploi s'affiche.
J'ai fais beaucoup de recherche sur google, différents forums, etc... mais je comprend pas trop d'où vient mon erreur. Au début, je voulais faire ça en Php, mais j'ai vu sur internet qu'apparemment JS est plus adapté... mais je ne veux pas absolument du JS, si vous avez une solution qui marche sans, c'est parfait !
Je vous copie le code entier de ma page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>mon CV en ligne</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="my_css.css" />
</head>
<body>
<?php include("head_fr.php"); ?>
<?php include("menu_fr.php"); ?>
<div id="corps">
<div class="job">
<p class="titrecorps">Nom du job - <em>date</em></p>
<p>employeur</p><br />
<p> <img src="lireplus.jpg" alt="lire plus" onclick="showpara(p1);" /> </p>
<p id="p1" style="display: none">voici une description plus détaillée</p>
</div>
<script type="text/javascript">
<!--
function showpara(id)
{
if (document.getElementById(id).style == 'none')
document.getElementById(id).style='block';
else
document.getElementById(id).style='none';
};
-->
</script>
</div>
<?php include("foot_fr.php"); ?>
</body>
</html>
voila si quelqu'un pouvait me sortir de ce pétrin je lui en serais très reconnaissant !
A voir également:
- Masquer/afficher paragraphe avec Javascpript
- Chaque paragraphe doit être espacé de 0,42 cm ou 12 pt du paragraphe qui suit - Guide
- Afficher appdata - Guide
- Masquer conversation whatsapp - Guide
- Comment masquer les amis sur facebook - Guide
- Comment appeler en masquer - Guide
3 réponses
Bonjour,
Remplace tes
« document.getElementById(id).style »
par des
« document.getElementById(id).style.display »
Xavier
Remplace tes
« document.getElementById(id).style »
par des
« document.getElementById(id).style.display »
Xavier
merci Xavier pour ta réponse, il est vrai que c'est évident...
Cependant, le paragraphe ne s'affiche toujours pas...
Quelqu'un pour m'aider ? :s
Cependant, le paragraphe ne s'affiche toujours pas...
Quelqu'un pour m'aider ? :s
Oui excuse-moi, je me suis arrêté à l'évident ^^'
Il y a aussi un problème de guillemets là :
<p> <img src="lireplus.jpg" alt="lire plus" onclick="showpara(p1);" /> </p>
p1 n'est pas une variable, mais une chaîne de caractère. Il faut donc l'entourer par des quotes, simples « ' » ou doubles « " ». Comme tu es déjà dans un onclick entouré de double-quotes, le plus simple est de mettre :
<p> <img src="lireplus.jpg" alt="lire plus" onclick="showpara('p1');" /> </p>
Xavier
Il y a aussi un problème de guillemets là :
<p> <img src="lireplus.jpg" alt="lire plus" onclick="showpara(p1);" /> </p>
p1 n'est pas une variable, mais une chaîne de caractère. Il faut donc l'entourer par des quotes, simples « ' » ou doubles « " ». Comme tu es déjà dans un onclick entouré de double-quotes, le plus simple est de mettre :
<p> <img src="lireplus.jpg" alt="lire plus" onclick="showpara('p1');" /> </p>
Xavier