The lightbox form doesn't load in the middle of the page

Hi,

I have added the JotForm lightbox button to my page (in the footer), but now the revolution slider fails to load, I have seen the support article: https://www.jotform.com/answers/617368-Javascript-conflict-with-revolution-slider-JS, but it gives me clear guide on how to resolve this.

Thanks,

Matt

Have you tried to adding the script below before the lightbox embed code of your form and see if this will fix the issue?

<script type="text/javascript">

   $.noConflict();

</script>

If the issue still persists, can you try to add this script instead of the first one and see if it will help fix the issue?

<script type="text/javascript">

   jQuery.noconflict(true);

</script>

Hi Chriistian,

Unfortunately, neither of those worked.

Matt

On your Light box embed code, can you try to replace the https://form.jotformeu.com/static/feedback2.js?3.3.REV to https://form.jotformeu.com/static/feedback.js?3.3.REV. Remove the "2" on the feedback file name and see if this will help fix the issue?

<script src="https://form.jotformeu.com/static/feedback.js?3.3.REV" type="text/javascript"> var JFL_70334054344347 = new JotformFeedback({ formId: '70334054344347', base: 'https://form.jotformeu.com/', windowTitle: 'BCCMAC Safety Services', background: '#00924b', fontColor: '#FFFFFF', type: 'false', height: 500, width: 300, openOnLoad: false }); </script>

Hi,

Changing that means the slider loads too, which is great, however, the lightbox doesn't load in the middle of the page like it does when the '2' is present.  I hope that makes sense?!

Matt

Dear Matt,

I've checked your website and I've seen that the lightbox form does not open in the middle of the website as you have already indicated.

I've tried to change the CSS codes as you can see the screenshot below:

Those codes are calculated taking account each screen size and the lightbox form is placed in the middle of the every kind of screen. If you prefer, you can change it manually. However, this time the lightbox could be wrong-placed on the other screens.

The most you can do could be adding the following CSS codes to the form in order to give it a constant height:

.protoplus-dim + div {top: 0 !important;} 

I've forwarded this issue to our software developers in order to check the issue.

You are going to be informed via this thread as soon as the issue will be solved.

Thanks.