jQuery CSSの行の高さを文字数に応じて変更してください

Question

私のサイトには、当社の最新のツイートが表示されているTwitterウィジェットがあります。ただし、ツイートが一定の長さを超えていると、サイトのコンテナに収まりきらず、途切れることがあります。私はプログラム的にツイートの文字数に応じて要素の行の高さのCSSを変更したいと思います。

要素のこの部分は、ここで示されている定義CSS：

ul.tweet_list li{overflow-y: hidden;overflow-x: hidden;padding: 0.5em !important;height: 55px;line-height:55px;vertical-align: middle} 

、ページ上の要素のみが、このコードによって生成されます

<div class="tweeter_widget"></div> 

私はどうかを検出する必要がありますツイートの文字数が「X」個を超えている場合は、行の高さを55pxから24pxに変更します。

例：http://justpaste.it/twitter-widget テキストが長すぎると、その上の「白いコンテナ」がどこにあるのかが分かりません。私は次の行に折り返し、私の "赤い"コンテナに留まるように、テキストのこの "棒"の行の高さを変更したい。

これはPHPで行われますが、おそらくjQueryを使用する必要があることはわかっています。

編集：ここでつぶやきを生成JSがある：

/* Twitter initiates. Enter your username here. */ 
jQuery(function($){ 
     $(".tweeter_widget").tweet({ 
     join_text: "auto", 
     username: "username", 
     avatar_size: null, 
     count: 1, 
     auto_join_text_default: "", 
     auto_join_text_ed: "", 
     auto_join_text_ing: "", 
     auto_join_text_reply: "", 
     auto_join_text_url: "", 
     loading_text: "loading tweets..." 
     }); 
    }); 

Answer 1

see this fiddle

var cnt = $(".tweeter_widget").text().length; 
if (cnt > 10) { 
    $(".tweeter_widget").css("line-height", "5px"); 
} 

すなわち：ツイートを含むDIV以上10文字場合は、行の高さを変更します。

Answer 2

いくつかの作業はまだ行われないが、おそらくありますが、つぶやきのDIVセッターに含めるためのコードを編集：

/* Twitter initiates. Enter your username here. */ 
jQuery(function($){ 
     $(".tweeter_widget").tweet({ 
     join_text: "auto", 
     username: "username", 
     avatar_size: null, 
     count: 1, 
     auto_join_text_default: "", 
     auto_join_text_ed: "", 
     auto_join_text_ing: "", 
     auto_join_text_reply: "", 
     auto_join_text_url: "", 
     loading_text: "loading tweets..." 
     }); 
     if ($(".tweeter_widget").html().length > X) 
     { 
     $(".tweeter_widget").css('line-height', '24px'); 
     } 
}); 

チャンスはこれが動的に更新するので、あなたはコールバックのいくつかの並べ替えでこれを延期したいと思うです。私が正しくツイートAPIを理解していれば、あなたはこれを行うには、フィルタパラメータを使用することができます。

/* Twitter initiates. Enter your username here. */ 
jQuery(function($){ 
     $(".tweeter_widget").tweet({ 
     join_text: "auto", 
     username: "username", 
     avatar_size: null, 
     count: 1, 
     auto_join_text_default: "", 
     auto_join_text_ed: "", 
     auto_join_text_ing: "", 
     auto_join_text_reply: "", 
     auto_join_text_url: "", 
     loading_text: "loading tweets...", 
     filter: function(t) { 
        if (t.tweet_raw_text.length > X) 
        { 
         $(".tweeter_widget").css('lineheight', '24px'); 
        } 
        return t; 
       } 

     }); 
}); 

を私はもちろん、このコードをテストしていません。