API Styling Javascript + HTML

Question

API Styling Javascript + HTML

0

В основном я использую bootstrap CSS с панелями/заголовками

У меня есть API, идущий от Twitch.tv Kraken, который захватывает 3 потока

Моя проблема заключается в том, что он показывает 3 потока в одной коробке

<div class="panel panel-default">
  <div class="panel-heading">
    <h3 class="panel-title"><div id="content1"></div> - <div id="content2"></div></h3>
  </div>
  <div class="panel-body">
    <div id="content3"></div>
  </div>
</div>

Если бы кто-нибудь мог дать мне какие-то указания, я был бы очень благодарен

Gav 01 янв. 2014, в 11:35

Источник

0

Я не понимаю вопроса. Вы просите JQuery поместить все изображения в div # content3, и это именно то, что он делает. Вы имеете в виду, что вы хотели бы видеть изображения, показанные рядом или что-то?
kuroi neko 01 янв. 2014, в 10:08

Теги:

html

css

design

twitch

1 ответ

Ещё вопросы

Я не понимаю вопроса. Вы просите JQuery поместить все изображения в div # content3, и это именно то, что он делает. Вы имеете в виду, что вы хотели бы видеть изображения, показанные рядом или что-то?

VenomVendor · Accepted Answer · 2014-01-01T08-27-00.000Z

Вы добавляете все элементы в цикл.

Повторно создайте элементы и добавьте их отдельно.

ДЕМО: http://jsfiddle.net/82wNq/30/show/

КОД: http://jsfiddle.net/82wNq/30/

    function (data) {
    var temp = "";
    $.each(data.streams, function (index, item) {
        temp = temp + "<div class='panel-heading'><h3 class='panel-title'></h3><div id='content1'>" + item.channel.display_name + "</div><div id='content2'>" + item.viewers + "</div></div><div class='panel-body'><div id='content3'><img src='" + item.preview.medium + "'/></div></div>";
    });
    $("#content").html(temp); }

@Gav это будет создавать дубликаты IDs изменить id='content1' в class='content1' , аналогично для других внутренних элементов, имеют идентификатор только для родителей, т.е. #content я неуместна </h3> в спешке.