1

テキストブロックを垂直方向にサイズ変更して、dotdotdotjQueryellipsis-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 に答える