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
    });
     
     
  • 相关阅读:
    mysql用户
    mysql字符集
    tidb之一致性算法raft学习
    更新港资股票数据
    php中的时区设置
    PHP 中的注释
    python下如何处理windows的路径名
    安装第三方模块
    偏函数
    装饰器没学明白,记录一下,以后再学
  • 原文地址:https://www.cnblogs.com/panax/p/8417950.html
Copyright © 2011-2022 走看看