OVH Cloud OVH Cloud

"espace d'image"

4 réponses
Avatar
Viper
En complément de ma question sur les "espaces de texte" (un grand merci
d'ailleurs pour votre précieuse aide), en voici une autre consernant l'image.
En effet le texte (dont je parlais de l'autre question) contient des liens
hypertextes que j'aimerais ouvrir sur la meme pas page à un endroit précis.
J'ai crée une couche à cet effet mais lors de la création du lien, on ne peut
apparement prendre de couche come cible ... une idée ?

Merci d'avance

4 réponses

Avatar
B. M.
Viper a écrit :
En complément de ma question sur les "espaces de texte" (un grand merci
d'ailleurs pour votre précieuse aide), en voici une autre consernant l'image.
En effet le texte (dont je parlais de l'autre question) contient des liens
hypertextes que j'aimerais ouvrir sur la meme pas page à un endroit précis.
J'ai crée une couche à cet effet mais lors de la création du lien, on ne peut
apparement prendre de couche come cible ... une idée ?

Merci d'avance



Si j'ai bien compris, tu voudrais faire apparaitre une couche en
cliquant sur un lien. Il va falloir faire appel à du javascript pour
manipuler les propriétés CSS de la couche.
D'abord donner un "id" à la couche, par exemple :
<div id="lien1">blabla</div>
Ensuite rendre cette couche invisible au niveau de la feuille de style
(dans le head ou dans un fichier externe) :
<style type="text/css">
<!--
#lien1 {visibility: hidden} (+ toutes les autres propriétés de
positionnement ou de style)
-->
</style>
Puis mettre le code suivant dans le lien :
<a href="#"
onclick="document.getElementById('lien1').style.visibility='visible';
return false">texte du lien vers la couche lien1</a>

Voila ! Maintenant, je pressent la prochaîne question : je voudrais
qu'en cliquant surun lien dans le texte de ma couche le visiteur la
fasse disparaitre. Il suffit de mettre ça dans la couche :
<div id="lien1">blabla<br><a href="#"
onclick="document.getElementById('lien1').style.visibility='hidden';
return false">Fermer</a></div>

Autre chose ?

--
B. M.
Avatar
Viper
merci beaucoup.
Mais ça ne marche apparement pas, j'ai du faire une erreur quelque part ...
tant pis.
Avatar
B. M.
Viper a écrit :
merci beaucoup.
Mais ça ne marche apparement pas, j'ai du faire une erreur quelque part ...
tant pis.



Fait une page simple avec le code suivant, essaye de comprendre comment
ça marche, et à partir de là tu devrais arriver à reproduire sur une
page plus compliquée :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>
<style type="text/css">
<!--
#lien1 {visibility: hidden; position: absolute; left: 40%; top: 20%;
height: 5em; width: 10em; background: yellow; padding: 2em}
-->
</style>
</head>
<body>
<p><a href="#"
onclick="document.getElementById('lien1').style.visibility='visible';
return false">lien</a></p>
<div id="lien1"><p>blabla<br><a href="#"
onclick="document.getElementById('lien1').style.visibility='hidden';
return false">Fermer</a></p></div>
</body>
</html>


--
B. M.
Avatar
B. M.
Pour être plus explicite, la même chose, mais avec deux liens :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>essai</title>
<style type="text/css">
<!--
#lien1, {visibility: hidden; position: absolute; left: 40%; top: 20%;
height: 5em; width: 10em; background: yellow; padding: 2em}
#lien2, {visibility: hidden; position: absolute; left: 40%; top: 20%;
height: 5em; width: 10em; background: red; padding: 2em}
-->
</style>
</head>
<body>
<p><a href="#"
onclick="document.getElementById('lien1').style.visibility='visible';
document.getElementById('lien2').style.visibility='hidden'; return
false">lien1</a></p>
<p><a href="#"
onclick="document.getElementById('lien2').style.visibility='visible';
document.getElementById('lien1').style.visibility='hidden'; return
false">lien2</a></p>

<div id="lien1"><p>blabla<br><a href="#"
onclick="document.getElementById('lien1').style.visibility='hidden';
return false">Fermer</a></p></div>

<div id="lien2"><p>blibli<br><a href="#"
onclick="document.getElementById('lien2').style.visibility='hidden';
return false">Fermer</a></p></div>
</body>
</html>

--
B. M.