php / bootstrap gallery,以模态显示图像

时间:2015-03-04 21:59:26

标签: php twitter-bootstrap modal-dialog

我在使用模态的bootstrap中有画廊。我写了一个小脚本来加载文件夹中的图像。

我的问题是图片不显示在模态中只有空格。当我尝试在模态之外显示它时,它可以工作。问题在哪里?

这是一小段代码:

<div id="myModal1" class="modal fade">
                 <div class="modal-dialog">
                    <div class="modal-content">
                       <div class="modal-header">
                          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                       </div>
                       <div class="modal-body">
                          <div class="carousel slide" id="screenshot-carousel" data-ride="carousel">
                             <ol class="carousel-indicators">
                                <li data-target="#screenshot-carousel" data-slide-to="0" class="active"></li>
                                <li data-target="#screenshot-carousel" data-slide-to="1"></li>
                             </ol>
                             <div class="carousel-inner">
                                   <?php
                    $dirname = 'Gallery/';
                    $images = glob($dirname . "*");
                    foreach ($images as $image) {
                        echo "<div class=".'item active'.">";
                            echo "<img src=".'$image'."'alt=".'Text of the image'.">";
                            echo "<div class=".'carousel-caption'.">";
                            echo "<h3>Highway heading</h3>";
                            echo "<p>This is the caption</p>";
                            echo "</div>";
                            echo "</div>";
                    }
                ?>  
                             <!-- End Carousel inner -->
                             <a href="#screenshot-carousel" class="left carousel-control" data-slide="prev">
                             <span class="glyphicon glyphicon-chevron-left"></span>
                             </a>
                             <a href="#screenshot-carousel" class="right carousel-control" data-slide="next">
                             <span class="glyphicon glyphicon-chevron-right"></span>
                             </a>
                          </div>
                          <!-- End Carousel -->
                       </div>
                    </div>
                 </div>
              </div>
            </div>

1 个答案:

答案 0 :(得分:0)

您需要检查单引号和双引号。您将变量包装在单引号中,因此如果查看html源代码,它将查找名为“$ image”的图像,请尝试更改为:

echo "<img src='".$image."' alt='Text of the image'>";