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

    I want to change position of Progress bar widget

    Asked by RamasamyVenugopal on June 22, 2016 at 10:08 AM
    Hi, the link to the code is no longer valid. Is there a solution?
  • Profile Image
    JotForm Support

    Answered by beril on June 22, 2016 at 10:20 AM

    I've cloned your form and injected the code that was provided by my colleague. It is working fine on my side. We would appreciate it if you could inject the CSS code below:

    .form-all {

    position: relative;

    }

    .progressBarContainer {

    position: absolute;

    bottom: 0;

    width: 690px !important;

    background: #FFF;

    z-index: 9999;

    }

    .form-submit-button {

    margin-bottom: 80px;

    }

    Here is how it works on my side:

     

    If you have any question or issues, please do not hesitate contacting us. We will be glad to assist you.

  • Profile Image

    Answered by RamasamyVenugopal on June 22, 2016 at 10:29 AM

    It is hiding the Next button

  • Profile Image
    JotForm Support

    Answered by Charlie on June 22, 2016 at 01:11 PM

    May I know what form you are working on? I presume its the form titled "OAD Project Proposal 2016"? I don't see an progress bar widget added on that form.

    May we also know if you want it to stick on the bottom of the screen, meaning, if you scroll down you should still see it displaying in your screen overlapping other fields. Or do you want it to stick at the very bottom of the page? 

    You could try adding this custom CSS code:

    .progressBarContainer {

        position: fixed !important;

        bottom: 0;

        margin-left: auto !important;

        margin-right: auto !important;

        max-width: 700px !important;

        z-index: 999999;

    }

     

    See if that one works.