28173 sujets

CSS et mise en forme, CSS3

Image ou bouton qui fait apparaître un texte caché (RESOLU)

Bonjour,

J'aimerais produire l'équivalent en CSS d'un javascript qui permet, en cliquant sur une image (bouton ou flèche p.ex), de faire apparaître un texte caché puis de le refermer.

Le javascript est le suivant :
<html>
<head>
<title>...</title>
<script type="text/javascript">
//------------------
function Swap( div_){
  var Obj = document.getElementById( div_);
  if( Obj){
    if( Obj.style.display=="")
      Obj.style.display="none";
    else
      Obj.style.display="";
  }
}
</script>
</head>

<body>
<a href="#" onclick="Swap('DIV_1');">Rubrique 1</a>
<div id="DIV_1" style="display:none; padding-left:10px;">
Ceci est le Texte de la Rubrique 1<br>
</div>
<br>
<br>
<a href="#" onclick="Swap('DIV_2');">Rubrique 2</a>
<div id="DIV_2" style="display:none; padding-left:20px">
Ceci est le Texte de la Rubrique 2
</div>
</body>
</html>


Merci d'avance.
Modifié par vivi (20 Feb 2007 - 17:08)
Pourquoi cette résignation ? Javascript est tout à fait adapté à cette tâche Smiley cligne

Il faut simplement revoir la chose de manière à fournir un résultat accessible et propre avec et sans support JS ou CSS:
- pas de lien servant uniquement à une action javascript en dur dans le HTML. Ces liens doivent eux-mêmes être générés via javascript, à l'initialisation de la page. Et doivent être indépendant du périphérique utilisé (clavier, souris).
- prévoir une CSS par défaut qui présente proprement le contenu "à plat", sans onglets. Et ajouter via javascript les classes nécessaires à la présentation en onglet.
- attention éventuellement au rendu avec JS/CSS activées, mais couleurs désactivées par le navigateur (décision à prendre sur la prise en compte ou non des défaut d'IE5.x et des extensions pour Firefox)
Modifié par Laurent Denis (20 Feb 2007 - 17:15)
Sujet clos
Aller à