Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/php/249.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 从文件夹中提取所有图像并创建引导旋转木马/幻灯片放映_Javascript_Php_Jquery_Twitter Bootstrap 3_Bootstrap Carousel - Fatal编程技术网

Javascript 从文件夹中提取所有图像并创建引导旋转木马/幻灯片放映

Javascript 从文件夹中提取所有图像并创建引导旋转木马/幻灯片放映,javascript,php,jquery,twitter-bootstrap-3,bootstrap-carousel,Javascript,Php,Jquery,Twitter Bootstrap 3,Bootstrap Carousel,我被这段代码困住了,我试图把所有的图片放到一个文件夹中,并把它们放在列表或div中,以创建引导旋转木马 <div id="spa_gallery" class="carousel slide" data-ride="carousel"> <!-- Carousel indicators --> <!-- Wrapper for carousel items --> <div class="carousel-inner"&g

我被这段代码困住了,我试图把所有的图片放到一个文件夹中,并把它们放在列表或div中,以创建引导旋转木马

  <div id="spa_gallery" class="carousel slide" data-ride="carousel"> 
    <!-- Carousel indicators -->

    <!-- Wrapper for carousel items -->
    <div class="carousel-inner">


<?php
$dirname = "spa_gallery/";
$images = glob($dirname."*.jpg");
foreach($images as $image) {
$imagelist.= '<li class="item"><a href=""><img src="'.$image.'" /></a>      </li>';
}
?>


    <!-- Carousel controls --> 
    <a class="carousel-control left" href="#spa_gallery" data-slide="prev">        <span class="glyphicon glyphicon-chevron-left"></span> </a> 
<a class="carousel-control right" href="#spa_gallery" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span> </a> 
</div>
</div>

以前的代码是:

<div class="carousel-inner">
  <div class="item active"> <img src="spa_gallery/01.jpg"  alt="First Slide"> 
</div>
  <div class="item"> <img src="spa_gallery/02.jpg" alt="Second Slide"> </div>
  <div class="item"> <img src="spa_gallery/03.jpg" alt="Third Slide"> </div>
  <div class="item"> <img src="spa_gallery/04.jpg" alt="Fourth Slide"> </div>
  <div class="item"> <img src="spa_gallery/05.jpg" alt="Fifth Slide"> </div>
</div>

尝试使用

<?php
$dirname = "spa_gallery/";
$images = glob($dirname."*.jpg");
foreach($images as $image) {
  ?>
   <div class="item"><img src="<?php echo $image; ?>" /></div>
  <?php
}
因此,您的代码将是

<?php
$class_active = true;
$dirname = "spa_gallery/";
$images = glob($dirname."*.jpg");
foreach($images as $image) {
  ?>
   <div class="item <?php if($class_active == true){ echo 'active' ; $class_active = false} ?>"><img src="<?php echo $dirname.$image; ?>" /></div>
  <?php
}


运行代码时发生了什么?您希望发生什么?是否在某个位置回显$imagelist?如何为任何图像添加class=“item active”以开始幻灯片放映。幻灯片是从这个图像开始的吗?意思是代码是这样的:……引导程序要求第一个元素的class=“active”开始slideshow@luna.romania我明白你的意思了我更新了我的答案。。但您可以从我的回答中告诉我您使用的每个脚本,我会将其修改为您不工作:
        $dir_imgs   = "spa_gallery";
        $files_imgs = scandir($dir_imgs);
        foreach ($files_imgs as $key_imgs => $value_imgs){
            $php_imgs = explode(".", $value_imgs);
            $php_imgs = end($php_imgs);
            if ($php_imgs == "jpg"){    
                ?>
                <div class="item"><img src="<?php echo $dir_imgs.'/'.$value_imgs; ?>" /></div>
                <?php       
            }
        }
$class_active = 0;  // before foreach

<div class="item <?php  echo (($class_active == 0)? 'active' : '') ?>">
$class_active = 1;
<?php
$class_active = true;
$dirname = "spa_gallery/";
$images = glob($dirname."*.jpg");
foreach($images as $image) {
  ?>
   <div class="item <?php if($class_active == true){ echo 'active' ; $class_active = false} ?>"><img src="<?php echo $dirname.$image; ?>" /></div>
  <?php
}