I would like to add modal functionality in a list of images wrapped in a div. It should work like so: when i click on a span element the next image should show in a modal. Html example below.

<?php foreach($datas as $data): ?>
    <div class="modal-thumbnail">
        <span class="modal-toggle">
            <img class='img-responsive' src='<?php echo $data->getImage(); ?>' alt='<?php echo $data->getAlt(); ?>'>
        <div class="modal-content">
            <div class="inner">
                <img class='img-responsive-full' src='<?php echo $data->getImage(); ?>' alt='<?php echo $data->getAlt(); ?>'>
                <span class="text"><?php echo $data->getDesc(); ?></span>
<?php endforeach; ?>

If more information is needed I will provide what is asked.


  • are you using bootstrap modal functions?
    – user48180
    Oct 24, 2017 at 10:18
  • I'm using the Magento2 modal widget functionality
    – Vlad Patru
    Oct 24, 2017 at 10:19


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.