我创建了bootstrap模式。以下图片是专辑封面图片
<ul class="list-inline galleryItems">
@foreach($albums as $album)
<li data-toggle="modal" data-target="#myModal"><a href="#myGallery" data-slide-to=""><img src="{{ url('src/images/gallery/albums_cover',$album->photo->name) }}"><br>
Caption</a></li>
@endforeach
<!--end of thumbnails-->
我创建了模态的主体和页脚如下
<div class="modal fade" id="myModal">
<br><br><br><br>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<div class="pull-left">My Gallery Title</div>
<button type="button" class="close" data-dismiss="modal" title="Close"> <span class="glyphicon glyphicon-remove"></span></button>
</div>
<div class="modal-body">
<!--begin carousel-->
<div id="myGallery" class="carousel slide" data-interval="false">
<div class="carousel-inner">
<div class="item active "> <img src="{{ url('src/images/gallery/albums_cover',$first_album->photo->name) }}" alt="item{{ $album->id }}" />
<div class="carousel-caption">
<h3></h3>
<p></p>
</div>
</div>
@foreach($albums as $album)
@foreach($album->photos as $photo)
<div class="item"> <img src="{{ url("src/images/gallery/album{$album->id}",$photo->name) }}" alt="" />
<div class="carousel-caption">
<h3></h3>
<p></p>
</div>
</div>
@endforeach
@endforeach
</div>
<!--Begin Previous and Next buttons-->
<a class="left carousel-control" href="#myGallery" role="button" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span></a> <a class="right carousel-control" href="#myGallery" role="button" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span></a>
<!--end carousel--></div>
<!--end modal-body--></div>
<div class="modal-footer">
<div class="pull-left">
<small>Photographs by <a href="#" target="new">Lorempixel.com</a></small>
</div>
<button class="btn-sm close" type="button" data-dismiss="modal">Close</button>
<!--end modal-footer--></div>
<!--end modal-content--></div>
<!--end modal-dialoge--></div>
<!--end myModal-->></div>
因此,每次我点击任何相册,它都会显示所有照片。我只想显示属于该文件夹的图像
先谢谢你