zoukankan      html  css  js  c++  java
  • Clamp.js插件,解决文本多行省略,兼容IE等浏览器

    下载

    Clamp.js项目地址:https://github.com/josephschmitt/Clamp.js

    引入

    <!-- 文本多行省略插件 -->
    <script src="js/clamp.min.js"></script>
    

    使用

    1、 单行省略

    $clamp(myHeader,{clamp:1})
    

    2、多行省略

    $clamp(myHeader,{clamp:3})
    

    3、根据有效的高度自动省略

    $clamp(myparagraph,{clamp:'auto'})
    

    4、基于固定元素高度的省略

    $clamp(myparagraph,{clamp:'35px'})
    

    文本需要使用p标签或div标签,span不行。

    // 文本多行省略,兼容IE等浏览器
    <body>
    <div class="container">
      <div id="content">
        8月26日晚公告称,2020年上半年实现营业收入155.41亿元,净利润64.05亿元,分别同比增长39.92%、57.88%。数字化驱动客户规模跃升自2019年在行业率先提出全面数字化转型,加码布局金融科技前沿领域,转型亮点备受行业关注。
      </div>
    </div>
    
    <script src="./js/clamp.min.js"></script>
    <script>
      var module = document.getElementById("content");
      $clamp(module,{clamp:3})
    </script>
    </body>
    

    效果

  • 相关阅读:
    多态
    抽象类和接口
    面向对象3
    类的继承 设计模式
    面向对象2
    面向对象
    复习
    对json的简单认识
    关于AJAX
    PHP配置开发环境
  • 原文地址:https://www.cnblogs.com/ZerlinM/p/13889685.html
Copyright © 2011-2022 走看看