Testo troncato con puntini o con "continua" 
Autore: Marzio D.
Visite 2970,
Followers 2,
Condiviso 0
Ciao mi servirebbe che un testo molto lungo venisse troncato con la parola "segue" o altre parole e che cliccandoci sopra si aprisse tutto il testo, in rete trovo script ma onestamente non ci capisco molto.....
Con WS 13 pro esiste la possibilità, anche a pagamento, di fare questo?
Grazie
Marzio
Postato il
... se vuoi fare solo con il programma, è semplicissimo e funzionale...
... in una pagina metti le anteprime troncate dei testi, con alla fine di ogni pargrafo: LEGGI TUTTO>>
... realizza le pagine nascoste con il testo completo, per esempio pagina_testo1.html ...eccetera...
... alle rispettive voci "LEGGI TUTTO>>" ... assegnerai il collegamento alla relativa pagina nascosta...
... tutto semplicemente cliccando...
...
... oppure potresti trovare in rete centinaia di effetti ACCORDION, che per me lasciano il tempo che trovano se se ne può fare a meno, altrimenti usare i codici reperiti in rete per incorporarli nel Progetto tramite gli Oggetti Codice HTML ed i pannelli ESPERTO..
.
Autore
Grazie KolAsim per la tempestiva risposta, in attesa leggendo le varie domande nel nostro forum ho notato che il forum stesso utilizza un pulsante "MOSTRA PIU' - MOSTRA MENO" è molto difficile avere quel tipo di effetto.
Grazie
... non posso entrare nel merito del programma che non ho, in quanto si potrebbe agire sugli stessi DIV con codice ad hoc...
... ma! ...un ACCORDION (dei tanti) semplicissimo ed immediato da implementare, è >> questo
... basta selezionare e copiare l'interno del TAG STYLE ed incollarlo nella sezione esperto/CSS dell'Oggetto Codice HTML...
... poi, nello stesso oggetto nel tab HTML incollerai il codice da selezionare dentro al TAG BODY a partire da:
<button class="accordion">Section 1</button> ******
... compreso sino a:
}
</script>
...
... tu che hai il programma potrai verificarlo immediatamente; due copia/incolla ed hai fatto...
.. al posto del testo dei pulsanti, per esempio Section 1 ...puoi inserire la descrizione abbreviata del testo da espandere...
.
Autore
Grazie faccio delle prove e ti faccio sapere.
Marzio
Marzio guarda se una cosa cosi ti potrebbe andare bene ?
http://provews.altervista.org/leggitutto/
questo è eccezionale, grazie al super lavoro di Maesi
http://quellidelcucuzzolo.blogspot.it/2016/08/effetto-vertical-sliding-website-x5.html
o anche questo
http://quellidelcucuzzolo.blogspot.it/2016/04/effetto-accordion-oggetti-website-x5.html
credo che quello che cerca marzio somigli più a questo...
lo script (commentato) va inserito in proprietà della pagina, tab esperto...
<script>
$(function(){ /* to make sure the script runs after page load */
$('.item').each(function(event){ /* select all divs with the item class */
var max_length = 250; /* lunghezza in caratteri del testo visibile inizialmente */
if($(this).html().length > max_length){ /* controllo della lunghezza del testo */
var short_content = $(this).html().substr(0,max_length); /* spezza il testo in due parti */
var long_content = $(this).html().substr(max_length);
$(this).html(short_content+
'<a href="#" class="read_more"> LEGGI TUTTO</a>'+
'<span class="more_text" style="display:none;">'+long_content+'</span>'); /* Alter the html to allow the read more functionality */
$(this).find('a.read_more').click(function(event){ /* find the a.read_more element within the new html and bind the following code to it */
event.preventDefault(); /* prevent the a from changing the url */
$(this).hide(); /*nasconde il bottone leggi tutto */
$(this).parents('.item').find('.more_text').show(); /* visualizza il testo nascosto */
});
}
});
});
</script>
<style>.read_more {font-weight:900 !important;font-size:10px;color:blue !important;text-decoration:none;background:white !important;padding:6px 12px 4px 16px;}</style>
e funzionerà in automatico dopo i 250 caratteri (che si possono aumentare o diminuire) assegnando al div contenitore del testo la classe "item"... ad es.: <div id="uno" class="item">testo testo testo testo</div>...
la class .read_more è personalizzabile a piacere..
Autore
Ciao, scusate il ritardo nella risposta, ho fatto un test al link:
www.marmary.com/pippo alla pagina pagina1.html
Non guardate i colori/impaginazione è solo un test. (già questo può soddisfare le mie esigenze, il tutto si appoggia su un file .js inserito nella cartella sul server nominata JS)
Vorrei provare lo script di Scheggia 12 chiedo da comune mortale dove inserisco la classe ad un semplice testo inserito in una cella?
Scusate la mia ignoranza
Marzio
ad esempio così...
<div id="uno" class="item">testo testo testo testo</div>
Autore
Ciao Skeggia, questo lo avevo capito, ma come lo inserisco, cerco di farmi capire meglio:
Inserisco quanto da te scritto in un aggetto html o altro del tipo in una cella testo?
Ho fatto un test in locale con il tuo codice inserendo lo script come da tue info e il testo che lo lancia in uno oggetto html (<div id="uno" class="item">testo testo testo testo</div>) ma così è riduttivo nel senso che non riesco ad inserire immagini o quanto altro in più ho notato che me lo apre ma non mi propone un link per la sua chiusura, probabilmete sono io che sbaglio...
Grazie
Marzio
Autore
Ti posto un link sulla prova che ho fatto con il scrpt:
www.marmary.com/pippo
pagina2.html
Marzio
si il mio non crea il pulsante di chiusura...
oppure prova questo...in allegato... con le istruzioni...
Autore
Grazie Skeggia 12, farò dei test per vedere quello che mi è più consono. Con tutte le info che mi avete trasmesso posso chiudere il post.
Ancora grazie
Marzio