javascript - JS CSS线夹重置(TextOverflowClamp.js)

我正在使用TextOverflowClamp.js尝试对某些文本进行行夹持。在减小窗口宽度时可以使用，但在增加窗口宽度后不会重置。在触发线夹并且窗口宽度大于设置的条件大小之后，有人可以帮助重置线夹吗？

Codepen

所有代码都在Codepen中，但是我的调整大小和加载功能在这里：

var winWidth;
$(window).resize(function () {
  winWidth = $(window).width();
  if (winWidth <= 991) {
    loadClamp();
  }
  else {
    // reset line clamp code here
  }
}).resize();

function loadClamp() {
  $(window).on('resize', function() {

    // TextOverflowClamp.js
    clamp(document.getElementById('js-toclamp1'), 1);

  });
}

最佳答案

我似乎找不到适合TextOverflowClamp.js的网站。但是，通读代码本身，似乎传递0作为第二个参数应该删除了截断符（尚不清楚这是否是有意的，但似乎可行）。但是，如果最初有任何内部元素，则这些内部元素将丢失并且不会保留。在您的示例中，它只是文本，因此应该没问题：

var winWidth;
$(window).resize(function () {
    winWidth = $(window).width();
    if (winWidth <= 991) {
        loadClamp(1);
    }
    else {
        // back to normal
        loadClamp(0);
   }
}).resize();

function loadClamp(lines) {
    clamp(document.getElementById('js-toclamp1'), lines);
}

有关代码的一些其他说明。每次调用resize时，您都要添加一个附加的loadClamp处理程序，实际上没有任何理由。我删除了。

此外，将TextOverflowClamp代码放置在自己的代码之前也很重要。

http://jsfiddle.net/w9nkad0u/

关于javascript - JS CSS线夹重置(TextOverflowClamp.js)，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28592188/