Ho recentemente lavorato a una funzione di commento. Per impostazione predefinita, l'altezza dell'elemento del paragrafo che contiene il testo è 80 px. Overflow è impostato su nascosto.Come mostrare elemento figlio quando un altro elemento figlio sta traboccando con JQuery
Ho un altro pulsante (etichettato "Vedi altro") che espande il paragrafo modificando l'altezza su "auto". Questo pulsante dovrebbe essere visibile solo se il contenuto del paragrafo sta traboccando dall'altezza 80px predefinita. In caso contrario, il pulsante non deve essere visualizzato.
Ho provato a farlo con un ciclo javascript for e qualche codice JQuery, anche se non funziona come dovrebbe. Mostra o nasconde il pulsante per tutte le sezioni dei commenti.
Ecco il codice html:
<div class="commentOwnerPost">
<div class="commentPostHeader">
<h4 class="commentOwnerName"><a href="">NavyFoxKid</a></h4>
<h4 class="commentPostDate">3 days ago</h4>
</div>
<p class="commentText"> lorem ipsum dolor sit amet consectur lorem ipsum dolor sit amet consectur
\t amet consectur lorem ipsum dolor sit amet consectur lorem ipsum
</p>
\t
<div class="commentPostFooter">
<a class="btnReply">Reply</a>
<a class="btnSeeMore">See More</a>
</div>
</div>
Ecco il JavaScript:
$(document).ready(function(){
var element = $('.commentOwnerPost');
for(i=0; i < element.length; i++){
var commentText = $(element[i]).children('.commentText');
if ($(commentText).offsetHeight < $(commentText).scrollHeight) {
$parent = $(commentText).parent('.commentOwnerPost');
$parent.find('.btnSeeMore').hide();
console.log('Comment text not overflowing ');
} else {
$parent = $(commentText).parent('.commentOwnerPost');
$parent.find('.btnSeeMore').show();
console.log('Comment text overflowing ');
}
$('.btnSeeMore').click(function(){
\t \t \t
});
}
});
Grazie per aver dedicato del tempo a leggere . Qualsiasi aiuto sarebbe apprezzato.
' "traboccante di JQuery"' dovrebbe essere così slogan –
non vorrei cercare di "rilevare" straripante, perché è una seccatura e consuma molte risorse rispetto a ciò che guadagni. Forse potresti semplificare il tuo problema, ad esempio calcolando la lunghezza del testo del paragrafo invece per un'approssimazione abbastanza buona. – Piwwoli
Possibile duplicato di [Posso rilevare un evento di overflow in jQuery?] (Http://stackoverflow.com/questions/10431659/can-i-detect-an-overflow-event-in-jquery) – Piwwoli