Texte caché mais lisible lors d'un clique

Texte caché mais lisible lors d'un clique - HTML/CSS - Programmation

Marsh Posté le 20-01-2009 à 09:54:44    

Bonjour
 
Je sais le titre n est pas très explicite  :??:  
 
Tout d 'abord voilà l'effet que je recherche (descendre au premier article Collectif Dardex-Mort2faim)
lien: http://secondenature.org/-Actualite-Festival-.html
 
On pourra noter que l on voit une entete d 'article et 2 petites flèches sur la droite qui permettent de lire l'intégralité du sujet.
 
Je souhaiterai refaire le meme effet pour mon site (en gros une image + entetes ou bref résumé et lorsque l 'internaute est intéressé il clique sur les flèches et il peu lire l'intégralité de l'article )
 
Donc après j ai cherché, je pense que c est du html (pas de php du moins je le pense lol)  
 
Donc voilà je demande un peu d'aide ou un lien qui pourrai m expliquer la base de ce petit effet, après peu etre j ai mal cherché mais j ai rien trouvé sur le site ici lol
 
J'espère avoir poster au bon endroit sinon dsl  
 
En vous remerciant  
a++

Reply

Marsh Posté le 20-01-2009 à 09:54:44   

Reply

Marsh Posté le 20-01-2009 à 11:29:18    

En javascript avec scriptaculous -> http://script.aculo.us/ :

 
Code :
  1. <img onclick="montrerCacher('article_1');" scr="image_fleche"  alt="cliquez pour voir le détail"/>
  2.  
  3. <div style="display: none" id="article_1" >
  4. Texte caché
  5. </div>
 

entre tes balises <head>:

Code :
  1. <script type="text/javascript" src="http://script.aculo.us/prototype.js"></script>
  2. <script type="text/javascript" src="http://script.aculo.us/scriptaculous.js"></script>
  3. <script type="text/javascript">
  4. function montrerCacher(id_element)
  5. {
  6.    if($(id_element).style.display == 'none')
  7.    {
  8.          Effect.BlindDown(id_element);
  9.          return false;
  10.    }
  11.    else
  12.    {
  13.          Effect.BlindUp(id_element);
  14.          return false;
  15.    }
  16. }
  17. </script>
 

Voir explication de ces effets :
http://wiki.github.com/madrobby/sc [...] -blinddown
http://wiki.github.com/madrobby/sc [...] ct-blindup


Message édité par Alisteroid le 20-01-2009 à 11:29:29
Reply

Marsh Posté le 20-01-2009 à 12:16:24    

Merci beaucoup je vais y bosser dessus  
 
je pense que ca me conviendra

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed