php - 单击图像时如何制作图像以在 codeigniter View 中放大 Bootstrap ？

Question

<h5>
<a href="<?php echo base_url(); ?>/vendor/home/projects" >Back to Projects</a>
<h5>
<div>
<div class="container">
<div class="row">
<?php
foreach ($projects as $value) {
?>
<?php                                                  
$project_images =  json_decode($value['project_gallery'],true);
$i=0; 
foreach ($project_images as $project_image_value) {
$i++;
?> 
<div class="col-md-2">
<img src="<?= base_url() ?>assets/uploads/projects/<?=$project_image_value['fname']?>" onclick="openModal(<?= $i?>)"   class="img-thumbnail img-responsive " />
<div><?=$project_image_value['title']?></div>
</div>                                                                                               <?php
}
?>
<?php
}
?>
</div>
</div>

这是我用来显示图像的 codeigniter View 。我怎样才能应用灯箱，以便当您单击图像时，只有该图像应该被缩放

Answer 1

有很多易于使用的 JQuery 插件可用于图像缩放类功能。使用以下任何一项:

使用很简单:

$(document).ready(function(){
  $('a.photo').zoom({url: 'photo-big.jpg'});
});

Reference

更多引用:

https://i-like-robots.github.io/EasyZoom/

http://www.jqueryscript.net/tags.php?/image%20zoom/

http://www.jqueryscript.net/demo/Simple-jQuery-Magnifying-Glass-Image-Zoom-Plugin-magnify-js/