Lightbox form is not responsive on mobile devices

  • binksford
    Asked on January 13, 2016 at 4:15 AM
    when I try to add the lightbox option it looks wrong on mobile devices - half of it is cut off and I cannot scroll - even though I specified that the form is responsive.

    This is the code I am entering:

    <script src="https://form.jotform.co/static/feedback2.js?3.3.REV" type="text/javascript"> var JFL_52580978762874 = new JotformFeedback({ formId: '52580978762874', base: 'https://form.jotform.co/', windowTitle: 'Ford Focus Enquiry Form', background: '#48649C', fontColor: '#FFFFFF', type: 'false', height: 500, width: 690, openOnLoad: false }); </script> <a class="btn lightbox-52580978762874" style="margin-top: 16px"> 2015 Ford Focus Enquiry Form </a>

     

    live example is on the last image on page http://binksford.com.au/new-car-showroom/new-ford-focus/ at the top left hand corner. I have to remove it by tomorrow as this page is live.

  • BJoanna
    Replied on January 13, 2016 at 4:24 AM

    Unfortunately, our lightbox embed options are not optimize for mobile devices.

    I will escalate this issue to our developers and we will inform you via this thread once this issue is resolved. 

    As possible workaround you can try with solution provided by my colleagues on this thread:

    http://www.jotform.com/answers/686728-Lightbox-embed-code-is-not-mobile-responsive  

  • binksford
    Replied on January 14, 2016 at 1:45 AM

    Hi Joanna,

    It worked! :) I'd like to change the style of the clickable link to a box style. If you have a look at http://binksford.com.au/new-car-showroom/new-ford-focus/ on the last image of the page there is a box labelled "Register Your Interest". How do I create a similar box to click through to the lightbox?
  • BJoanna
    Replied on January 14, 2016 at 3:13 AM

    I am glad to hear that workaround provided by my colleagues from other thread worked. 

    Considering that your last question is not related to subject of this thread I have moved your question to separate thread and we will provide you an answer there. 

    http://www.jotform.com/answers/744669 

  • Scott JotForm Developer
    Replied on February 24, 2017 at 6:19 AM

    Hey Natalie,

    Our UI developers fixed this situation, where the lightbox embedded forms were not responsive.

    You do not need any workarounds anymore. And also, since the lightbox embed code's updated through fetched JS files, you do not need to re-embed anything again. It should just work as responsive, still when you delete the workaround CSS codes.

    We will be still waiting for your response and feedback,

    Cheers.

  • binksford
    Replied on September 11, 2017 at 12:28 AM

    Hi Scott,

    Apologies it's taken so long but I just tried the lightbox. It doesn't work as expected on desktop or mobile, doesn't pop up when you click on the link/box for mobile and for desktop a blank screen pops up. I could really use some guidance on this issue.

     

    Regards,

    Natalie

  • BJoanna
    Replied on September 11, 2017 at 1:41 AM

    On the webpage http://binksford.com.au/new-car-showroom/new-ford-focus/ you previously provided I was not able to find a lightbox embedded form.

    Please provide us the exact URL of the page where you embedded a lightbox form that is not working. 

  • binksford
    Replied on September 11, 2017 at 2:17 AM

    Please have a look at http://binksford.com.au/new-car-showroom/ford-fiesta/

     

     

     

    Lightbox form is not responsive on mobile devices Image 1 Screenshot 20

    Below the ENQUIRE NOW box. I was using Mozilla Firefox browser.

  • Support_Management Jotform Support
    Replied on September 11, 2017 at 3:42 AM

    I'm seeing a couple of different embed codes on your website:

    1. Popup codes on the ENQUIRE NOW button

    2. Lightbox codes underneath the ENQUIRE NOW button

    3. Script embed codes on the ENQUIRE NOW tab (right beside the SPECIAL OFFERS tab)

    4. Popup codes on the ENQUIRE NOW button on your footer

    5. Lightbox codes on the script section of your footer

    6. oEmbed codes from WP

    For testing purposes, can you please remove all the other embed codes except for the Lightbox Codes just to check if there's something conflicting with your current embed codes?

    I did test the Lightbox codes from my end and it works as intended. You can test it here, where I used the exact Lightbox codes from your form.

  • binksford
    Replied on September 11, 2017 at 7:27 PM

    Hi, the lightbox seems to work when it's a blank page with only the header and footer. http://binksford.com.au/test/

    However, I need it to work with all my other embeded codes that you mentioned above also.

     

    Regards,

    Natalie

  • Support_Management Jotform Support
    Replied on September 11, 2017 at 8:29 PM

    Hello Natalie, the Lightbox doesn't seem to work on the new test link you provided. I don't see it opening when I click on the "Contact Us Enquiry" link.

    http://binksford.com.au/test/ 

    I found an issue that is similar to how you first described it:

    ...and for desktop a blank screen pops up

    I moved your earlier post to a separate thread so we can discuss and escalate it accordingly.

    https://www.jotform.com/answers/1244868

    I'll be replying there shortly after doing some tests.