创建随机图像幻灯片

时间:2016-01-27 09:39:26

标签: php html web

我现在有一个网站直播,图片按顺序显示我想用滑块添加一些动态,并使其随机显示图像而不是这是基本代码:

    <div class="container slideshowContainer" style="width: 100%;">
        <!-- BEGIN REVOLUTION SLIDER -->    
        <div class="fullwidthbanner-container slider-main margin-bottom-10">
            <div class="fullwidthabnner">
                <ul id="revolutionul" style="display:none;">                                                                                       
                    <!-- OUTPUT THE SLIDES -->
                    <?php
                        foreach($slides as $d){
                    ?>

                        <li data-transition="fade" data-slotamount="8" data-masterspeed="700" data-delay="9400" data-thumb="assets/img/sliders/revolution/thumbs/thumb2.jpg">
                                        <?php if($d['slideshow_image_sub_title_4'] != ""){ ?>
                                <a href="<?php echo $d['slideshow_image_sub_title_4']; ?>">
                                    <img src="uploads/images/<?php echo $d['slideshow_image_file']; ?>" title="<?php echo $d['slideshow_image_title']; ?>" style="width: 100%;" />
                                </a>                                
                            <?php } else { ?>
                                    <img src="uploads/images/<?php echo $d['slideshow_image_file']; ?>" title="<?php echo $d['slideshow_image_title']; ?>" style="width: 100%;" />
                            <?php } ?>
                        </li>
                        <?php
                        }
                    ?>                      
                </ul>
                <div class="tp-bannertimer tp-bottom"></div>
            </div>
        </div>
        <!-- END REVOLUTION SLIDER -->
    </div>    

我如何修改它以帮助随机显示图像 请问我是否需要提供更多信息

提前致谢

2 个答案:

答案 0 :(得分:2)

试试这个:

div class="container slideshowContainer" style="width: 100%;">
    <!-- BEGIN REVOLUTION SLIDER -->    
    <div class="fullwidthbanner-container slider-main margin-bottom-10">
        <div class="fullwidthabnner">
            <ul id="revolutionul" style="display:none;">                                                                                       
                <!-- OUTPUT THE SLIDES -->
                <?php
                    shuffle($slides);
                    foreach($slides as $d){
                ?>

                    <li data-transition="fade" data-slotamount="8" data-masterspeed="700" data-delay="9400" data-thumb="assets/img/sliders/revolution/thumbs/thumb2.jpg">
                                    <?php if($d['slideshow_image_sub_title_4'] != ""){ ?>
                            <a href="<?php echo $d['slideshow_image_sub_title_4']; ?>">
                                <img src="uploads/images/<?php echo $d['slideshow_image_file']; ?>" title="<?php echo $d['slideshow_image_title']; ?>" style="width: 100%;" />
                            </a>                                
                        <?php } else { ?>
                                <img src="uploads/images/<?php echo $d['slideshow_image_file']; ?>" title="<?php echo $d['slideshow_image_title']; ?>" style="width: 100%;" />
                        <?php } ?>
                    </li>
                    <?php
                    }
                ?>                      
            </ul>
            <div class="tp-bannertimer tp-bottom"></div>
        </div>
    </div>
    <!-- END REVOLUTION SLIDER -->
</div>    

http://php.net/manual/de/function.shuffle.php

答案 1 :(得分:0)

我很确定有比这更好的答案,但我实现这一点的方法是使用数字命名图片,并使用以下代码加载它们:

<img src="uploads/images/<?php.rand(1,9).".jpg";?>">

我希望这会有所帮助。