评论：jQuery溢出显示省略号插件dotdotdot.js  [查看原文]

百分比自适应以解决网页缩小后再放大文字截取过少问题

<div class="box">
    <p class="par" data-con="文字内容">文字内容
</div>

$(function(){
    $(".box").dotdotdot();
    $(window).resize(function(){
        $(".box").each( function(index,val) {
            var html = $(this).find("p").attr("data-con");
            $(this).find("p").html(html);
            $(this).dotdotdot();
        });
    });
})

hardworking1
2018/12/12 19:40:44

css样式


.box{
   float: left;
   width: 85%;
   border:1px solid #000;
   margin-top: 10px;
   max-height:72px;
   overflow: hidden;
   font-size:20px;
   line-height:24px;
}

hardworking0
2018/12/2 16:29:13

body{
   display: flex;
}

这个属性后a.readmore就不能正常使用了

hardworking0
2018/4/8 16:12:06
没问题 是我字体没设置
此时在谷歌下是21px 在火狐下是24px
导致高度不够 直接咋火狐下显示点点点

hardworking0
2018/4/8 16:14:56
带边框

菇凉……我是好人0
2018/5/11 11:46:01
我的只显示。。。

hardworking1
2018/4/6 22:14:46
用第六个例子呀 直接用正则匹配出现的位置

如果要处理的字符串里面有多个空格，这个插件就废了，容易在以最近空格处为终点出现省略号，这是一个很严重的bug

如果盒子一开始是隐藏的  点击一个按钮才显示  

就失效了

我想知道省略号的出现是根据什么判断的。。。表示不太会看源码~~~~求~作者大大解释下

hardworking0
2018/4/6 22:15:40
是看你的需求在什么地方 你只要把这个六个地方的用法都熟悉就好了

只能用id吗，class选择好像不生效

无忧无虑1
2018/8/31 9:42:30

用class是生效的,class和id都是为了dom操作,用id需要一个个调用,不符合开发思想
例如:容器加上class='text-eclipses'


$(".text-eclipses").dotdotdot();

项目中为了避免ovreflow的不同,最好在css中加上


.text-eclipses{
  overflow: visible!important;//或是hidden,不能是scroll,auto
}

需求不同，你不用可以，但请别否认！它的存在必定有他存在的道理