zoukankan      html  css  js  c++  java
  • js实现单双行文本溢出添加省略号

    # 单双行文本溢出省略
    ```
    // 2. 当内容过多的时候,单行省略号:
                    overflow: hidden;
                    text-overflow:ellipsis;
                    white-space: nowrap;
    // 3. 多行省略号:
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 2;
                    overflow: hidden;
    
    /*---------------------------文本兼容省略号----------------*/
            function wordlimit(cname,wordlength){                  //参数分别为:类名,要显示的字符串长度
            //   var cname=document.getElementsByClassName(cname);  //需要加省略符号的元素对象
                for(var i=0;i<cname.length;i++){           
                   var nowhtml=cname[i].innerHTML;                //元素的内容
                    var nowlength=cname[i].innerHTML.length;      //元素文本的长度
                    if(nowlength>wordlength){
                        cname[i].innerHTML=nowhtml.substr(0,wordlength)+'...';      //截取元素的文本的长度并加上省略号
                    }
                }
            }
            wordlimit($(".figureKorea figcaption"),19);
    /*---------------------------引入插件ellipsis.js----------------*/
    $('.shopText').ellipsis({
    english: false,
    lineNum: 2
    });
     
     
  • 相关阅读:
    模块二
    lambda map() filter() zip()练习
    装饰器
    函数模块回顾
    连接不同数据OleDb(不完整)
    连接不同的数据库
    连接数据库ORACLE(不完整)
    多数据之间的连接操作ODBC(不完整)
    ora0131
    ORACLE linux 下 sqlplus命令
  • 原文地址:https://www.cnblogs.com/panax/p/8417950.html
Copyright © 2011-2022 走看看