Fonction "lire la suite" en html

Résolu/Fermé
Escienca Messages postés 428 Date d'inscription mercredi 12 janvier 2011 Statut Membre Dernière intervention 29 mai 2024 - 26 juil. 2011 à 09:53
Escienca Messages postés 428 Date d'inscription mercredi 12 janvier 2011 Statut Membre Dernière intervention 29 mai 2024 - 26 juil. 2011 à 10:49
Bonjour,

Je voudrais créer une fonction "lire la suite" au bout d'un texte. C'est à dire écrire un texte en HTML et au bout de ce texte intégrer un "lire la suite" mais qui apparaisse directement sur la page. Exemple :

Les ancêtres des publications de presse telles qu'on les connaît aujourd'hui datent du début du XVIIe siècle, avec les premières gazettes qui rendent comptent plus ou moins régulièrement de l'actualité dans des articles distincts. En 1631, La Gazette de Théophraste Renaudot publie des nouvelles de l'étranger et de la Cour. Le ton de ses articles étant jugé trop neutres ou trop soumis au pouvoir, d'autres publications font leur apparition, privilégiant les articles de commentaires. La Révolution française, qui consacre « la libre communication de la pensée et des opinions », permet à tout citoyen d'écrire et d'imprimer librement. Les critiques et les prises de position constituent alors l'essentiel des articles de l'époque...lire la suite

Je veut que cette suite apparaisse directement à la suite du texte, pas sur une nouvelle page.

En vous remerciant de votre aide.


A voir également:

2 réponses

thevinou Messages postés 1008 Date d'inscription lundi 28 février 2011 Statut Membre Dernière intervention 10 mars 2015 190
Modifié par thevinou le 26/07/2011 à 09:57
tu fais 2 div, une qui contiendra ton texte d'intro, une qui contient ton texte complet.

ta seconde div est cachée.

Lors d'un clic sur un lien (lire la suite), ta 2eme div devient visible.

Tu auras donc cet effet d'afficher du texte en cliquant sur ton bouton "lire la suite"
0
Escienca Messages postés 428 Date d'inscription mercredi 12 janvier 2011 Statut Membre Dernière intervention 29 mai 2024 57
26 juil. 2011 à 10:49
Bonjour,

il suffit parfois d'une petite piste pour trouver sa soluce. C'était bien avec un div caché.

J'ai trouvé un code que j'ai bidouillé comme suis :

<head>
<style type="text/css" media="all">
/* Ce style CSS ne dois pas être enlevé, sinon les divs ne se cacherons pas ... */
.cachediv {
visibility: hidden;
overflow: hidden;
height: 1px;
margin-top: -1px;
position: absolute;
}
</style>
<!-- Script créé par KevBrok ;-) -->
<script type="text/javascript">
/*
* Montre / Cache un div
*/
function DivStatus( nom, numero )
{
var divID = nom + numero;
if ( document.getElementById && document.getElementById( divID ) ) // Pour les navigateurs récents
{
Pdiv = document.getElementById( divID );
PcH = true;
}
else if ( document.all && document.all[ divID ] ) // Pour les veilles versions
{
Pdiv = document.all[ divID ];
PcH = true;
}
else if ( document.layers && document.layers[ divID ] ) // Pour les très veilles versions
{
Pdiv = document.layers[ divID ];
PcH = true;
}
else
{

PcH = false;
}
if ( PcH )
{
Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
}
}

/*
* Cache tous les divs ayant le même préfixe
*/
function CacheTout( nom )
{
var NumDiv = 1;
if ( document.getElementById ) // Pour les navigateurs récents
{
while ( document.getElementById( nom + NumDiv) )
{
SetDiv = document.getElementById( nom + NumDiv );
if ( SetDiv && SetDiv.className != 'cachediv' )
{
DivStatus( nom, NumDiv );
}
NumDiv++;
}
}
else if ( document.all ) // Pour les veilles versions
{
while ( document.all[ nom + NumDiv ] )
{
SetDiv = document.all[ nom + NumDiv ];
if ( SetDiv && SetDiv.className != 'cachediv' )
{
DivStatus( nom, NumDiv );
}
NumDiv++;
}
}
else if ( document.layers ) // Pour les très veilles versions
{
while ( document.layers[ nom + NumDiv ] )
{
SetDiv = document.layers[ nom + NumDiv ];
if ( SetDiv && SetDiv.className != 'cachediv' )
{
DivStatus( nom, NumDiv );
}
NumDiv++;
}
}
}

/*
* Montre tous les divs ayant le même préfixe
*/
function MontreTout( nom )
{
var NumDiv = 1;
if ( document.getElementById ) // Pour les navigateurs récents
{
while ( document.getElementById( nom + NumDiv) )
{
SetDiv = document.getElementById( nom + NumDiv );
if ( SetDiv && SetDiv.className != '' )
{
DivStatus( nom, NumDiv );
}
NumDiv++;
}
}
else if ( document.all ) // Pour les veilles versions
{
while ( document.all[ nom + NumDiv ] )
{
SetDiv = document.all[ nom + NumDiv ];
if ( SetDiv && SetDiv.className != '' )
{
DivStatus( nom, NumDiv );
}
NumDiv++;
}
}
else if ( document.layers ) // Pour les très veilles versions
{
while ( document.layers[ nom + NumDiv ] )
{
SetDiv = document.layers[ nom + NumDiv ];
if ( SetDiv && SetDiv.className != '' )
{
DivStatus( nom, NumDiv );
}
NumDiv++;
}
}
}

/*
* Inverse les divs: Cache les divs visible et montre le divs cachés :)
*/
function InverseTout( nom )
{
var NumDiv = 1;
if ( document.getElementById ) // Pour les navigateurs récents
{
while ( document.getElementById( nom + NumDiv ) )
{
SetDiv = document.getElementById( nom + NumDiv );
DivStatus( nom, NumDiv );
NumDiv++;
}
}
else if ( document.all ) // Pour les veilles versions
{
while ( document.all[ nom + NumDiv ] )
{
SetDiv = document.all[ nom + NumDiv ];
DivStatus( nom, NumDiv );
NumDiv++;
}
}
else if ( document.layers ) // Pour les très veilles versions
{
while ( document.layers[ nom + NumDiv ] )
{
SetDiv = document.layers[ nom + NumDiv ];
DivStatus( nom, NumDiv );
NumDiv++;
}
}
}
</script>
</head>
<body>


<div name="mondiv1" id="mondiv1" align="center">

<font size="2"><b><u>Cosmologie</b></u>
<br><br>
<u>Définition:</u>
<br><br>
«Il faut souligner que c'est un science très particulière, qui présente un certain nombre de spécificités opératoires:

<a href="javascript:DivStatus( 'mondiv', '2' )"><font size="1">suite</a> </div></div>
<div name="mondiv2" id="mondiv2" class="cachediv" align="center">
<br>
<li>la première c'est que le système auquel on s'intéresse est unique (même si il y a un multivers, on n'observe qu'un univers). On s'inscrit donc en faux par rapport au processus usuel d'inférence des lois à partir d'observations de régularités lors de la répétition d'une même expérience. La situation est extrêmement spécifique, ce qui d'ailleurs que la cosmologie à longtemps été considérée hors champ de la science;
<br><br>
<li>la deuxième est liée au fait que l'observateur est partie intégrante du système qu'il observe. Du point de vue heuristique ce n'est pas très important, mais du point de vue conceptuel ce n'est pas tout à fait un détail. On désire en général se distancier de ce dont on élabore le modèle, ce que l'on ne peut évidemment pas faire en cosmologie;
<br><br>
<li>la troisième a trait à la non-contingence des conditions initiales. C'est quelque chose d'extrêmement important. En physique, on s'intéresse toujours aux lois mais jamais aux conditions de départs, à partir desquelles les équations donnent l'évolution. Ces conditions sont fixées par ce qui c'est passé «avant» ou «autre part». La physique ne s'étonne pas que deux flèches décochées par Achille ou par un archer débutant n'arrivent pas au même endroit bien qu'elles soient soumises aux mêmes lois: ceci est dû à ce que les conditions initiales n'étaient pas les mêmes. Mais, en cosmologie, il n'y a ni antériorité ni extériorité! Il faut donc une théorie qui, en quelque sorte, génère ses propres conditions initiales;
<br><br>
<li>enfin, il faut mentionner deux autres spécificités un peu moins importantes. D'une part, on réfléchit non pas à partir de l'état initial mais à partir de l'état final (c'est à dire de l'état actuel de l'univers). C'est l'inverse de ce que l'on fait habituellement et ce n'est pas tout à fait anodin. D'autre part, dès que l'on s'intéresse à l'univers primordial on doit faire face à des énergies très élevées, beaucoup plus élevées que celles qui ont été testées auprès des accélérateurs de particules. Il est impossible de ne pas en tenir compte: quand on élabore un scénario cosmologique cohérent, on doit extrapoler au-delà de la physique connue et mise à l'épreuve sur terre.»

Multivers - Mondes possibles de l'astrophysique, de la philosophie et de l'imaginaire
Par Aurélien Barrau, Patrick Gyger, Max Kistler, Jean-Philippe Uza
</div></div>
<body>

Et donc cela donne ça (j'ai fait une petite page rapide pour que chacun juge du résultat):

http://escienca.pagesperso-orange.fr/divcache.html

Rendons malgré tout à César ce qui lui appartient. Je suis parti d'un code que j'ai trouvé ici:

http://www.editeurjavascript.com/scripts/scripts_navigation_3_182.php

Merci de votre aide, et merci à KevBrok donc, le créateur du code duquel je suis parti pour arriver à mon résultat.

À bientôt...
0