JQuery Slide Down من التعليق الأول إلى صفحة كاملة

Question

لدي قائمة من 10 تعليقات على الصفحة. ارتفاعاتهم غير معروفة لأنها تعتمد على محتوى التعليقات.

ما هي أفضل طريقة لإظهار التعليق الأول فقط حتى تنقر فوق زر، عند نقطة تنزلق لأسفل للكشف عن جميع التعليقات العشرة في الصفحة؟ لذلك بشكل افتراضي، سيشاهد المستخدم تعليق واحد فقط، حتى ينقر فوق الزر "عرض المزيد" زر التعليقات، عند النقطة التي ستنزلقها للكشف عنها جميعا.

شكرا!

Answer 1

jQuery:

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

لغة البرمجة:

<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

إذا كان لديك زر مع الفصل viewMoreButton و div مع الفصل moreComments تحتوي على بقية التعليقات - ثم يمكنك استخدام هذا البرنامج النصي:

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

يزيل أيضا الزر نفسه، ولكن إذا كنت تريد أن يقوم الزر بتبديل التعليقات، فقم بذلك:

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