Effets d'Ecriture et de Texte

Fonction "Lire la suite..."


Supposons que vous ayez un texte assez long. Pour ne pas effrayer vos lecteurs potentiel, nous allons cacher une partie de ce texte. Il faudra cliquer sur un lien pour rendre la suite visible. Ce n'est pas bien compliqué.

Généralement dans un site on travail par facilité le CSS. Nous allons éditer le "global.css" avec notepad++ ou l'éditeur de texte que vous possédez.

Allez à la fin et copier/coller ce code :

Code CSS :
#lirelasuite {display:none;}


Dans le <head></head>, vous rajoutez :

Code HTML :
 
 <style type="text/css">
#lirelasuite {display:none;}
</style>


OU

Code HTML :
<link rel="stylesheet" href="/wiki/le chemin du fichier global.css" type="text/css" >


*le chemin du fichier gobal.css a remplacer évidement, par l'url du css en question.

Au niveau de lire la suite, vous rajoutez :

Code HTML :
 
 <p><a href="/wiki/#nogo" onclick="document.getElementById('lirelasuite').style.display = 'block';
this.style.display = 'none';">Lire la suite...</a></p>
<p id="lirelasuite">VOTRE TEXTE</p>


Résultat :

C’était il y a bien longtemps, mais peut-être hier. C’était bien loin d’ici, mais peut-être tout près de toi. A l’orée d’une belle forêt se dressait un majestueux château. Ses tours s’élançaient par-dessus les champs qui coloriaient la campagne. Les hommes, les fées, les animaux vivaient en harmonie dans ce pays, royaume de la Fée du Matin, connue pour sa bonté et sa sagesse lumineuses.

Lire la suite...

Sa petite fille Linotte, très étourdie, oubliait, perdait, jusqu'à ses paroles ou ses idées. Aussi, sa maman l’avait-elle nommée fée des écureuils, qui égarent leurs réserves de noisettes. La magie, et même les sorties étaient interdites à Linotte, qui vivait dans les nuages.



Vérifiez bien dans votre texte que vous n'ayez ni :
  • <p> et </p> autre que ceux du code
  • <div> et </div>
Cette page a été vue 8902 fois