Как сократить мой канал Twitter до последних 3-5 твитов в моей сети Tumblr с помощью HTML?

Как вы можете видеть в моем блоге, в твиттере много и много твитов. Мне нужно уменьшить это число до 3-5 твитов. Я разместил ниже HTML-код, но я вижу любой аргумент, такой как "предел", "число" или что-то в этом роде. Дело в том, что я не слишком разбираюсь в кодировании, поэтому, если вы можете мне помочь и рассказать, что я должен добавить, я буду очень благодарен.

.TWITTER {
    overflow: hidden;
}

.TWITTER #tweets a, .TWITTER #tweets a:visited {
    -khtml-border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    background: #79a4ba;
    color: #ffffff;
    display: block;
    margin: 4px 0;
    padding: 10px;
}

.TWITTER #tweets .content {
    color: #ffffff;
    font-size: 11px;
    font-weight: bold;
}

.TWITTER .TWITTER_bird {
    background: url('http://static.tumblr.com/l3zugnz/204kvwebe/twitterbird.png') no-repeat 0 0;
    height: 55px;
    margin-top: -10px;
    width: 200px;
}

.TWITTER .TWITTER_bird a, 
.TWITTER .TWITTER_bird a:visited, 
.TWITTER .TWITTER_bird a:hover {
    display: block;
    height: 55px;
    width: 200px;
}

2 ответа

Чтобы указать количество отображаемых твитов, вы можете изменить recent_tweets функция для:

function recent_tweets(data) {
    var tweetsToDisplay = 4;
    for (i=0; i <= tweetsToDisplay; i++) {
        document.getElementById("tweets").innerHTML =
            document.getElementById("tweets").innerHTML +
            '<a href="http://twitter.com/ramiroaznar/status/' +
            data[i].id + '"><div class="content">' + data[i].text +
            '</div></a>';
        }
    document.getElementById("twitter").style.display = 'block';
}

+ Изменить tweetsToDisplay на количество твитов, которые вы хотите показать.

В твите должна быть опция, позволяющая ограничить количество твитов. По общему признанию я действительно не знаю, как использовать это непосредственно, но один выбор состоит в том, чтобы использовать CSS, чтобы скрыть все другие твиты после третьего:

CSS:

#tweets a:nth-child(n+4) {
  display: none;
}

В основном это говорит "Выбрать все a внутри #tweets которые четвертые и прячутся ".

Смотрите это в действии здесь.

Единственным недостатком является то, что не все браузеры будут поддерживать это. Таким образом, старые версии IE (я думаю, что-либо ниже IE8) будут по-прежнему показывать все твиты. Современные браузеры будут прекрасно, хотя.

Другие вопросы по тегам