multiply div s repeat loop co div s

Asked

Viewed 376 times

0

I have a list of channel names that are broadcasting a certain game on twitch.tv (api), so I can take all the channels and list the same.

The question is how to put them in a div To stay in blocks horizontally (as in the image) and also that when it reached 4 blocks (div´s), jump to the bottom line.

<?php

$api2 = file_get_contents("https://api.twitch.tv/kraken/search/streams?client_id=g5ynk8n0llmefg9m70ruyg36bbt6si&query=fifa17&limit=100");

$defuse = json_decode($api2);

if($defuse == null){
    echo "erro";

}else{

$total_lives=$defuse->_total;

echo "Toltal de Lives:  ".$total_lives."</br>";


    foreach($defuse->streams as $v)

    echo "Nome do Canal: ".$v->channel->name."</br>";


}
?>

Quero que fique assim cada  nome em cada bloco inserir a descrição da imagem aqui`

3 answers

0


0

Look at the demo I made. Increase the result window to see JSFIDDLE

Using Jquery and Bootstrap

// Aqui comeca o for each
    <div class="col-md-3 channel">
        //php echo vai aqui
    </div>
//Aqui termina o foreach

CSS looks like this and you can adjust the column height

.channel {
    height: 150px; //Altura exemplo
}

And Jquery to get the Colors

function get_random_color() {
    var letters = '0123456789ABCDEF'.split('');
    var color = '#';
    for (var i = 0; i < 6; i++) {
        color += letters[Math.round(Math.random() * 15)];
    }
    return color;
}


$(".channel").each(function() {
    $(this).css('background-color', get_random_color());
});
  • It didn’t work out buddy I wanted to make each name would stick and a div in this way you spoke only got one div and not the other 99, wanted that each result of the foreach would be with a div

  • Look then PHP has been integrated in the wrong way. Foreach has to stay out of the div and echo inside it. Each time you go through the loop it generates the div. I’ll even edit the answer for you to see

  • Opa buddy I managed to solve thanks to your help thank you

  • I’m glad it worked out!

0

The code went like this

<html lang="en">

Lives . block{background-color:pink;height:250px;border: Solid 2px #000;}

</style>

        foreach($defuse->streams as $v){
             $todos_nomes = $v->channel->name;
    ?>
    <div class="bloco col-md-3">
    <?php echo $todos_nomes; ?>
</div>
<?php }}?>
</div>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.