Enlarge 2 pictures simultaneously

Question

Enlarge 2 pictures simultaneously

Navigation

#1 by (0 votes)

0

Good morning everyone, I need to click on 2 images and they should open side by side so the customer can do a comparison of before and after.

Note that I'm using materialboxed from materialize until ok if it clicks 1 image only, but when it selects 2 images wanted to do the same effect ...

<div class="col s2" style="width: 110px">
    <img src="<?php echo Url::getBase().'img/varizes2.jpg'?>" width="105" class="materialboxed"/>
    <label>
        <input type="checkbox" />
        <span>&nbsp;</span>
    </label>
</div>

javascript imagem

asked by anonymous 19.09.2018 / 13:34

1 answer

How do I make a function to calculate a factorial without recursion? [duplicate] Show modal only if there is an active session

score 0 · Answer 1

Neither documentation nor code specifies that HTML is required to be <img> .

So you can simply create a container and apply the plugin in the container instead of the images.

Example:

$('.compare').materialbox();

.compare {
  display: flex;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
     
<div class="compare">
  <img src="https://via.placeholder.com/200"><imgsrc="https://via.placeholder.com/200/fff000/ffffff">
</div>

JSFiddle working ...