[Javascript] Spoiler con anteprima

trattorino

Utente Attivo
23 Lug 2016
174
2
18
39
Salve esperti, volevo chiedervo come posso creare uno spoiler che si apre e chiude ma che mostra un anteprima se rimane chiuso...
esempio, io scrivo questa frase nel blocco

<blocco>Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler Spoiler
</blocco>
ora lo spoiler deve chiudere il blocco ma mostrando solo le 5 righe, il resto lo deve tenere nascosto, conoscete uno script che faccia questo? Grazie mille
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, qui trovi un esempio completo. Puoi cercare " read more javascript " sulla rete ne trovi altri.
 

trattorino

Utente Attivo
23 Lug 2016
174
2
18
39
ciao, a me interessava uno script che nn si limitava solo al testo, io ho un blocco div che contiene testo, immagini e video, non esiste qualche modo per basarsii sul blocco invece che sul testo? voglio che si basi sulle righe e nnon sul numero delle lettere per chiudere lo spoiler
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
puoi intervenire sull'altezza del contenitore
HTML:
<style>
    .blocco {
        background-color: #eee;
        width: 300px;
        height: 500px;
        overflow: hidden;
    }
    .min {
        height: 200px;
    }
</style>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<div class="blocco" onclick="$(this).toggleClass('min');">

</div>