1

我正在尝试让文本块垂直调整大小并使用 dotdotdot jQuery ellipsis-support 插件。dotdotdot 插件具有设置高度参数,我想知道是否有一种方法可以动态更新该设置高度。我想考虑相邻 div 的总高度并调整文本块的大小以适应特定 div 的整个高度。

我把这个 jsFiddle 作为我想要完成的一个松散的模型:http: //jsfiddle.net/smittles/8psvZ/

理想情况下,当红线向下移动时,概要文本将展开以下降到红线。

因为我使用的是设定高度,所以这个模型现在不起作用。我不知道要进行哪些调整才能使其正常工作。

如果可能的话,我确实想保持对 dotdotdot.js 的使用。

4

1 回答 1

3

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

请参阅此更新的小提琴或下面的代码片段:

$('.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
      });

    });        
});

您也可以通过创建一个执行 dotdotdot-ing 的函数来防止冗余代码。在页面加载时调用它,然后在随后的每个切换调用中调用它。

于 2012-06-26T18:55:54.070 回答