php - jQuery 根据字符数更改 CSS 中的行高

Question

我的网站上有一个 Twitter 小部件，用于显示我们公司最新的推文。然而，如果推文超过一定长度，它就无法放入网站的容器中并被 chop 。我想根据推文中的字符数以编程方式更改元素的行高 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”个字符，如果是，请将行高从 55 像素更改为 24 像素。我并不是想垂直居中文本，而是......

示例:http://justpaste.it/twitter-widget如果文本太长，它会在您看到上方“白色容器”的地方被 chop 。我想更改此文本“栏”的行高，以便它将换行到下一行并保留在我的“红色”容器中。

理论上，这可以使用 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 个字符，请更改行高。