那颗你读不懂的心
2019-05-22 16:08
采纳率: 50%
浏览 1.4k

在html中如何实现长段文本折叠

在html中,一段文字太长。想实现初始化后只显示一部分文字,点击显示更多后,显示全部。如何实现?

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

3条回答 默认 最新

  • weixin_36444515 2019-05-22 16:21
    已采纳

    jquery实现
    $(function() {
    var slideHeight = 45; // px 定义折叠的最小高度
    var defHeight = $('#wrap').height();
    if(defHeight >= slideHeight) {
    $('#wrap').css('height', slideHeight + 'px');
    $('#read-more').append('更多');
    $('#read-more a').click(function() {
    var curHeight = $('#wrap').height();
    if(curHeight == slideHeight) {
    $('#wrap').animate({
    height: defHeight
    }, "normal");
    $('#read-more a').html('折叠');
    } else {
    $('#wrap').animate({
    height: slideHeight
    }, "normal");
    $('#read-more a').html('更多');
    }
    return false;
    });
    }
    });

    1 打赏 评论
  • threenewbee 2019-05-22 16:12
    打赏 评论
  • 摄影陳 2019-05-22 16:18
    打赏 评论

相关推荐 更多相似问题