Créer un compte
Connexion

texte invisible

Pour créer et répondre aux sujets, vous devez être connecté.
Ce sujet est résolu.
Pages: 1
Auteur Message
znoeil
05/11/2009 à 11:42:00
znoeil
Membre
Salut tout le monde,
comment rendre un champ texte invisible visible
quand on clic sur un lien ou une image avec html.
Merci

<lien adresse="http://www.znoeil.com"/>Image
ybouane
06/11/2009 à 01:36:41
ybouane
Admin
Bonjour,
je te conseil de regarder le tutoriel suivant:
Afficher/Cacher un div(element) en javascript

Sinon, pour rendre visible un texte, il suffit de faire ça:
document.getElementById('id').style.visibility="visible";
et pour rendre invisible:
document.getElementById('id').style.visibility="hidden";
Merci  :)

Image
znoeil
11/11/2009 à 10:58:05
znoeil
Membre
Bonjour,
merci pour cette astuce
et maintenant si je veut que si on clic sur un
autre lien que le premier texte disparaisse automatiquement
pour laisser place au deuxième texte?
est ce que c est possible?
merci

<lien adresse="http://www.znoeil.com"/>Image
ybouane
12/11/2009 à 01:27:50
ybouane
Admin
Bonjour,
voici le code de ce que tu veut faire:
<style type="text/css">
.link
{
        cursor:pointer;
        font-size:1.2em;
}
.ctn
{
        border:1px dotted #cccccc;
        margin:2px;
        padding:2px;
        display:none;
}
</style>
<script type="text/javascript">
var dernier_ouvert = 1;
function change(name, id)
{
        document.getElementById(name+dernier_ouvert).style.display="none";
        document.getElementById(name+id).style.display="block";
        dernier_ouvert = id;
}
</script>
<span class="link" onclick="change('ctn_',1);">Lien 1</span><br />
<div id="ctn_1" class="ctn">
        Ceci est le contenu 1
</div>

<span class="link" onclick="change('ctn_',2);">Lien 2</span><br />
<div id="ctn_2" class="ctn">
        Ceci est le contenu 2
</div>

<span class="link" onclick="change('ctn_',3);">Lien 3</span><br />
<div id="ctn_3" class="ctn">
        Ceci est le contenu 3
</div>

<span class="link" onclick="change('ctn_',4);">Lien 4</span><br />
<div id="ctn_4" class="ctn">
        Ceci est le contenu 4
</div>
<script type="text/javascript">
change('ctn_',1);
</script>

Merci  :)

Image
znoeil
13/11/2009 à 11:20:18
znoeil
Membre
Bonjour,
désoler d être aussi chiant
est il possible d associer ce script
a une carte de france cliquable
voici un bout de code de ma carte
<div class="centrale">
<div class="carte_france">
<div><img usemap="#departements"
 src="img/map.gif"
 alt="Carte de France (régions et départements"
 longdesc="">
<map name="Departements" id="Departements">
 <area shape="poly"
 coords="391,296,397,284,396,276,401,272,400,265,383,
 266,367,255,358,284,365,288,362,299,380,285,391,296"
 alt="Ain (Rhône-Alpes)" title="Ain (Rhône-Alpes)"
 href="URL">
</map>
et qui apele mon texte
<h3>Ain (01)</h3>
<br />
<b class="enseigne">ENSEIGNE</b><br/>NOM PRENOM<br/>RUE<br/>
CODE POSTAL  VILLE<br/>Tel : <br/>Port : <br/>
Merci




<lien adresse="http://www.znoeil.com"/>Image
ybouane
14-11-2009 à 02:14:37
ybouane
Admin
Bonjour,
Voici le code que tu veut:
<style type="text/css">
.link
{
        cursor:pointer;
        font-size:1.2em;
}
.ctn
{
        border:1px dotted #cccccc;
        margin:2px;
        padding:2px;
        display:none;
}
#Departements area
{
        cursor:pointer;
}
</style>
<script type="text/javascript">
var dernier_ouvert = 1;
function change(name, id)
{
        document.getElementById(name+dernier_ouvert).style.display="none";
        document.getElementById(name+id).style.display="block";
        dernier_ouvert = id;
}
</script>
<img usemap="#departements" src="img/map.gif" alt="Carte de France (régions et départements" />
<map name="Departements" id="Departements">
 <area onclick="change('ctn_',1);" shape="poly" coords="391,296,397,284,396,276,401,272, 400,265,383,266,367,255,358,284,365,288, 362,299,380,285,391,296" alt="Ain (Rhône-Alpes)" title="Ain (Rhône-Alpes)" />
</map>
<div id="ctn_1" class="ctn">
    <h3>Ain (01)</h3>
    <br />
    <b class="enseigne">ENSEIGNE</b><br/>NOM PRENOM<br/>RUE<br/>
    CODE POSTAL  VILLE<br/>Tel : <br/>Port : <br/>
</div>
<script type="text/javascript">
change('ctn_',1);
</script>

Merci :)

Image
znoeil
14/11/2009 à 15:25:57
znoeil
Membre
Merci beaucoup :#1:

<lien adresse="http://www.znoeil.com"/>Image
Pages: 1