What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to display images as light box

    Asked by wingsco on July 23, 2015 at 05:31 PM

    Hi! I've managed to put an image inside the Hover Text Box of the images of my form, so I use that as a kind of "Light Box" effect. Everything is ok except for the fat that the box contour width doesn't follow the image size (480 px). i've tried this code in my"Inject Custom Css" field but with no results at all:

    .form-description {

    width: 480px !important; height: 480px; }

     

    What can I do for set the Hover Text box size of the images for 480x480 px?

    Inject Custom CSS style size height
  • Profile Image
    JotForm Support Manager

    Answered by Jeanette on July 23, 2015 at 08:22 PM

    What you have done with the Hover text is very clever, however, we have a sort of widgets that might help better, all you need to do is to add a Purchase order or any other Payment tool. And add the product lightbox widget

    Here is a demo form to see how it works: http://form.jotform.co/form/33604136500846

    Here is a very detailed guide about mastering payment integrations:

    http://www.jotform.com/help/323-Mastering-Payment-Form-Integrations-with-JotForm

    Do get back to us should you need further help.

  • Profile Image

    Answered by wingsco on July 23, 2015 at 11:21 PM

    To be honest I've moved from purchase order to this option I'm using today. It's more simple to our customers and more flexible on the layout aspect.

    I just need to adjust the size of the Hover Text box to fit the size of the image. All images have the same size (480x480px). How can I do that considering my first attempt on the custom css field (on the first message)?

  • Profile Image
    JotForm Support

    Answered by Chriistian on July 24, 2015 at 02:21 AM

    Hi wingsco,

     

    Can you try inject the custom CSS code below in your form?

    .form-description {

      width: 500px !important;

      height: 500px !important;

      max-width:500px !important;

      right: -500px !important;

    }

     

    To inject custom CSS code in your form, just follow this guide: How to Inject Custom CSS Codes.

     

    Do let us know if you need further assistance.


    Regards.