<div class="row mt-xlg">
<h5 class="text-semibold text-uppercase mt-lg">Timeline Photos</h5>
<?php
$query1="SELECT * FROM user_photos_offline WHERE ssmid='$ssmid' AND status='1' ORDER BY date_uploaded DESC";
$sql=mysql_query($query1);
$count=mysql_num_rows($sql);
$results=array();
while($row=mysql_fetch_assoc($sql)){
// $results[]=$row['image'];
?>
<div class="col-md-3">
<img src="upload_images/<?php echo $row['image']?>" class="img-responsive" id='image' alt="" style='height:200px;' data-toggle="modal" data-target="#largeModal">
<!--Here i am got all images from the database-->
<!--For example i got total 10 images from database-->
<!--For example i am clicking the 3rd image of the tatal 10 images-->
<div class="modal fade" id="largeModal" tabindex="-1" role="dialog" aria-labelledby="largeModalLabel" aria-hidden="true" style="display: none;">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="largeModalLabel">Original Image</h4>
</div>
<div class="modal-body">
<img src="img/girl.png" class="img-responsive" id='image' alt="" style='height:400px;width:100%'>
<!--From here i want show only 3rd image of the tatal 10 images-->
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
<?php
}
?>
</div>
我从总共10个图像中获取数据库，如果我点击第三个图像意味着，我想只显示第三个图像，我不知道为这个问题写代码有人知道的意思告诉我朋友
你必须在你的页面末尾添加一个模态(在for循环之外)，并添加你的列表中没有模态的每个图像:
<img src="upload_images/<?php echo $row['image']?>" class="img-responsive" alt="" onclick="showImg('upload_images/<?php echo $row['image']?>')">
则需要一个java脚本代码:
function showImg(url)
{
//load your image
$('.modal-body img').attr('src',url);
//show modal
$('#largeModal').modal();
}
希望这对你有帮助