How to have a fixed field while scrolling?

Hi,

I need a sticky calculation field at the top or bottom of the form.

By this I mean a field that does not scroll with the page. The fields also needs to be 100% across the viewport and with an opaque background.

The form will be embedded in an Adobe Muse page: https://inteez.net/landing/index.html

Can you help with this?

Thanks,

Guy

I created this form: https://form.jotformpro.com/71253319192959 and inserted the below CSS in Custom CSS field:

#label_5{
position:fixed;
margin-top:-90px;
margin-left:260px;
}
#input_5
{
position: fixed;
width:40%;
margin-top:-70px;
background-color: rgba(0, 0, 0, 0.4);
height:30px;
}

Could that be something that could work for you?

Also, a suggestion, maybe it will be better if the field is position all the way to the right.

Please let us know.

Thank you!

Thanks Nic!

Even if if it works with the jotform link, it does not work when the form is embeded

Have a look here: https://inteez.net/landing/index.html

The field scrolls with the page.

Do you have another suggestion?

Thanks,

Guy

It's an embedded content. Its style is limited to only absolute or relative. A workaround would be to embed the form using its source codes.

https://www.jotform.com/help/104-How-to-get-the-Full-Source-Code-of-your-Form

Note that there are CSS and scripts in the source codes. These part of the source codes should be placed inside your header tags. The <form> that ends with </form> should be placed within the body where you'd like the form to appear. 

Please try that and let us know how it goes.