Question

我试图让文本块垂直调整大小并使用dotdotdot jQuery省略号支持插件。 dotdotdot插件具有一个set height参数，我想知道是否有一种动态更新该设置高度的方法。我想考虑相邻div的总高度，并调整文本块的大小以适应特定div的整个高度。

我把这个jsFiddle作为我想要完成的事情的简单模型：http://jsfiddle.net/smittles/8psvZ/

理想情况下，当红线向下移动时，概要文本会扩展为下降到红线。

因为我使用的是设定高度，所以此模型现在无效。我不知道要做什么调整才能使其正常工作。

我确实希望尽可能保持使用dotdotdot.js。

Answer 1

使用toggle函数的回调重新调用dotdotdot代码。

请参阅this updated fiddle或以下代码段：

$('.share').click(function(){
    $('.social_options').toggle('fast', function(){

      // height will be height of image frame + share button
      var new_height = $('.image_frame').height() + $('.share').height();

      // if the social options are visible, add that to height as well
      if ($('.social_options').is(':visible'))
          new_height += $('.social_options').height();

      $('.synopsis').dotdotdot({
            ellipsis    : '... ',
            wrap        : 'word',
            after       : null,
            watch       : true,
            height      : new_height
      });

    });        
});

您也可以通过创建执行dotdotdoting的函数来防止冗余代码。在页面加载时调用它，然后在每次后续切换调用时调用它。

带有垂直大小调整的jQuery dotdotdot插件

1 个答案: