MIP个性化组件mip-showmore 显示更多

标题 内容
类型 通用
支持布局 responsive,fixed-height,fill,container,fixed
所需脚本 https://mipcache.bdstatic.com/static/v1/mip-showmore/mip-showmore.js

基本示例

<mip-showmore>
     <div showmorebox>
        <div>todo//</div>
      </div>
      <p showmorebtn>
          <span class="mip-showmore-btnshow">点击显示</span>
          <span class="mip-showmore-btnhide">收起</span>
      </p>
 </mip-showmore>

功能示例

超出高度隐藏

<mip-showmore maxheight='40' animatetime='.3'>
     <div showmorebox>
        <div>todo//</div>
      </div>
      <p showmorebtn>
          <span class="mip-showmore-btnshow">点击显示</span>
          <span class="mip-showmore-btnhide">收起</span>
      </p>
 </mip-showmore>

超出数字截断

<mip-showmore maxlen='10' animatetim='.3'>
        <div showmorebox>
             我是超出数字截断<em> 我是超出数字截断</em>我是超出数字截断<span> 我是超出数字截断</span> 我是超出数字截断 我是超出数字截断
        </div>
        <p showmorebtn>
            <span class="mip-showmore-btnshow">点击显示</span>
            <span class="mip-showmore-btnhide">收起</span>
        </p>
    </mip-showmore>

属性

maxheight
说明:高度阀值,单位为像素。如果元素高度超出阈值,隐藏超出部分,显示"显示更多按钮"。与maxlen不可同时使用,maxheight优先级大于maxlen
必选项:否
类型:数字
单位:无
默认值:无
使用限制:无

maxlen
说明: 内容字符串超出限制长度则会截断显示省略号,显示"显示更多按钮"。内容截断显示不包括图片显示。不允许多