javascript - Animate阅读更多/更少JQuery

我想向您阅读的更多/更少代码添加动画。
这样就可以顺利进行。
我的JQuery代码当前为：

$(document).ready(function(){
    $('.service-info').hide();
      $('.read-more').click(function(){
            $(this).siblings('.service-info').show();
            $(this).hide();
            $(this).parent().find('.read-less').show();
        })
      $('.read-less').click(function(){
        $(this).siblings('.service-info').hide();
        $(this).hide();
        $(this).parent().find('.read-more').show();
      })
  });

JSFiddle：https://jsfiddle.net/2bdto5fb/
我该如何实现？

最佳答案

如下所示使用slideDown()和slideUp()。

$(document).ready(function () {
    $('.service-info').hide();
    $('.read-more').click(function () {
        $(this).siblings('.service-info').slideDown('slow');
        $(this).hide();
        $(this).parent().find('.read-less').show();
    })
    $('.read-less').click(function () {
        $(this).siblings('.service-info').slideUp('slow');
        $(this).hide();
        $(this).parent().find('.read-more').show();
    })
});

UPDATED FIDDLE

关于javascript - Animate阅读更多/更少JQuery，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36596658/