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 如果文本太长,它会在您看到上方的"白色容器"的位置周围切断.我想更改文本"bar"的行高,以便它将换行到下一行并保留在我的"红色"容器中.

从理论上讲,这将使用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

看到这个小提琴

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

即:如果div中包含Tweet的字符超过10个,则更改行高.