How to create zooming effect on image?

https://www.jotform.com/help/220-How-to-create-a-lightbox-form

the image in question 4 is a bit rectangular and i was hoping to enlarge so user could see better

i am guessing a lightbox image is a good way to do this.

the link above seems clear, but a bit too techno for me to try without first inquiring.

any help from jot form is appreciated

thanks

max

The best way to achieve this, and use Lightbox embed method is to download Source code of your form: https://www.jotform.com/help/104-How-to-get-the-Full-Source-Code-of-your-Form  and implement the lightbox there.

And you could do that by creating another form that you can use as a lightbox, so in that form, you can only place the image you need:

And embed the code of lighbox in your main form. 

The reason you have to use the Source code is that you cannot insert script code to our form builder. 

On the other hand, I was able to create this zooming method:

Here is my form so you can check: https://form.jotform.com/73101553551952

And this is how to implement.

Instead of your image add Text field to your form: 

And add the below code to it:

<div class="zoomin"><img title="All you need to know about CSS Transitions " src="https://www.jotform.com/uploads/max123jot/form_files/sample2.772.jpg" /></div>

Then add the below code to your Custom CSS Field:

.zoomin img {

  height: 200px;

  width: 300px;

  -webkit-transition: all 2s ease;

     -moz-transition: all 2s ease;

      -ms-transition: all 2s ease;

          transition: all 2s ease;

}

.zoomin img:hover {

  width: 700px;

  height: 500px;

}

Hope it helps.

Let us know how it worked.

Thank you!