jQuery nach unten rutscht aus ersten Kommentar zur Seite

Question

Ich habe eine Liste von 10 Kommentaren auf einer Seite. Ihre Höhen nicht bekannt sind, weil sie auf den Inhalt der Kommentare ab.

Was wäre der beste Weg, um nur den ersten Kommentar zu zeigen, bis Sie auf eine Schaltfläche klicken, an welcher Stelle es nach unten gleitet, um alle 10 Kommentare auf der Seite zu zeigen? So standardmäßig würde der Benutzer nur einen Kommentar sehen, bis er die Mehr dazu Kommentare Schaltfläche klickt, an welcher Stelle es wird nach unten, um alle von ihnen zu zeigen.

Danke!

Answer 1

jQuery:

$(function(){
  $(".comments").not(":first").hide();
  $("#btnViewAll").click(function(){
    $(".comments").slideDown();
  });
});

HTML:

<input type="button" id="btnViewAll" value="Show All Comments" />
<div class="comments">1 comment</div>
<div class="comments">2 comment</div>
<div class="comments">3 comment</div>
<div class="comments">4 comment</div>
<div class="comments">5 comment</div>

Answer 2

Wenn Sie eine Taste mit der Klasse viewMoreButton und eine div mit der Klasse moreComments haben den Rest der mit Kommentaren-dann können Sie dieses Skript verwenden:

$("div.moreComments").hide();
$(".viewMoreButton").click(function(){
    $("div.moreComments").slideDown("fast");
    $(this).remove();
}

Es beseitigt auch die Taste selbst, aber wenn Sie die Taste, um die Kommentare wollen, dies tun:

$("div.moreComments").hide();
$(".viewMoreButton").click(function(){
    $("div.moreComments").slideToggle("fast");
}