Show images with php and bootstrap carousel

Question

I need to create an list of images with twitter bootstrap so I write:

<?php osc_run_hook('item_detail', osc_item() ) ; ?>
<?php if( osc_images_enabled_at_items() && (osc_count_item_resources() > 0) ) { ?>
<div class="row hidden-xs" id="mediaCarouselThumbs" style="padding: 15px;">
    <?php $itemCount = osc_count_item_resources(); ?>
<?php for($i = 0; $i < $itemCount; $i++) { ?>
                                                    <div class="pull-left" style="width: 11.11%;">
                                <a href="#" data-target="#mediaCarousel" data-slide-to="<?php echo $i;$i+1;?>" class="thumbnail" style="background-image: url(<?php echo osc_resource_url(); ?>);">&nbsp;</a>
                            </div><?php } ?>
                            <!---->

                                            </div>
        <?php } ?>

All is fine but echo osc_resource_url(); dont give me the right url and dont change it in the loop, also with $i is everything fine and work well... So after raun this code I get:

<div class="row hidden-xs" id="mediaCarouselThumbs" style="padding: 15px;">
                                                        <div class="pull-left" style="width: 11.11%;">
                                <a href="#" data-target="#mediaCarousel" data-slide-to="0" class="thumbnail" style="background-image: url(http://dive.agroagro.com/0.);">&nbsp;</a>
                            </div>                                                    <div class="pull-left" style="width: 11.11%;">
                                <a href="#" data-target="#mediaCarousel" data-slide-to="1" class="thumbnail" style="background-image: url(http://dive.agroagro.com/0.);">&nbsp;</a>
                            </div>                                                    <div class="pull-left" style="width: 11.11%;">
                                <a href="#" data-target="#mediaCarousel" data-slide-to="2" class="thumbnail" style="background-image: url(http://dive.agroagro.com/0.);">&nbsp;</a>
                            </div>                            <!---->

                                            </div>

What I need to do to change image URL on every loop. Thanks and sorry for my english.

Answer 1

The value returned by osc_resource_url() (in your current code) is "static" and is not affected by the current loop. This is the reason why all images are the same. One solution is to pass an argument to this function.

Because I have no idea what is the main job that this function do (are there any arguments that can be passed, what value will be returned, etc.), I'll suggest simple solution using array for images and urls:

<?php
    $itemCount = osc_count_item_resources();
    $images = array(
        array('url' => '#', 'image' => 'http://dive.agroagro.com/0.jpg'),
        array('url' => '#', 'image' => 'http://dive.agroagro.com/1.jpg'),
        array('url' => '#', 'image' => 'http://dive.agroagro.com/2.jpg'),
        array('url' => '#', 'image' => 'http://dive.agroagro.com/3.jpg')
    );
?>

    <?php for($i = 0; $i < $itemCount; $i++) { ?>
        <div class="pull-left" style="width: 11.11%;">
            <a href="<?php echo $images[$i]['url']; ?>" data-target="#mediaCarousel" data-slide-to="<?php echo $i;?>" class="thumbnail" style="background-image: url(<?php echo $images[$i]['image']; ?>);">&nbsp;</a>
        </div>
    <?php } ?>