Are your pop-up boxes mobile friendly?

  • Profile Image
    Arina Thomas 
    Asked on January 29, 2017 at 05:27 PM

    Hi

    I am a paid user of JotForm with caregatto. I would like to speak with someone about your pop-up box function, we have one setup, our website is live and unfortunatelyit isn't mobile friendly.

  • Profile Image
    Chriistian
    Answered on January 29, 2017 at 11:01 PM

    I checked your website and it looks like the pop-up appears on mobile properly.

    Are you perhaps referring to a different pop-up form on your page? If so, please do let us know.

    I will wait for your response.
    Regards.

  • Profile Image
    caregatto
    Answered on January 29, 2017 at 11:45 PM
    It's the same pop-up in the pic. When you try to put in your email address, you can't see what you're typing. You just see a dark screen as soon as you start writing your email. Also, I had to make the width extremely narrow to make it visible on mobile, so the same pop-up looks oddly narrow when viewed on desktop.
    Sent from my iPhone
    ...
  • Profile Image
    Chriistian
    Answered on January 30, 2017 at 12:58 AM

    By default, the popup will have a fixed height and width. However, you can add some code to make it adjust based on the screen. Here's the code:

    var parentWidth = window.innerWidth;

    if(window.innerWidth <= 499) {parentWidth = window.innerWidth-100;} else {parentWidth =  500;}

     

    You can try the example below where I have highlighted the code that we added in yellow.

    <script src="https://form.jotform.com/static/feedback2.js?3.3.REV" type="text/javascript">

        var parentWidth = window.innerWidth;

        if(window.innerWidth <= 499) {parentWidth = window.innerWidth-100;} else {parentWidth =  500;}

    var JFL_70057546927160 = new JotformFeedback({
        formId: '70057546927160',
        base: 'https://form.jotform.com/',
        windowTitle: 'PROMO CODE',
        background: 'white',
        fontColor: 'black',
        type: 'false',
        height: 600,
        width: parentWidth,
        openOnLoad: true
    });
    </script>

    If the issue persists, please let us know.
    Regards.

  • Profile Image
    Arina Thomas 
    Answered on January 30, 2017 at 01:45 AM
    Thank you. I might not have explained my main issue clearly. On mobile
    phone (iphone at least), when you try to type in your email address on the
    promo code pop-up, the entire screen is grayed out and you can't see what
    you're typing and all you see is a dark screen. It looks like you have to
    scroll down a lot to see the email field. Does this make sense? But I used
    the adjustable code thank you.
    ...
  • Profile Image
    Charlie
    Answered on January 30, 2017 at 02:30 AM

    May I know if you have removed the lightbox embed code on your website https://caregatto.com/? I'm unable to see the lightbox form. 

    Perhaps you can also try using the Pop-up embed code instead? It should open a new window when you click the hyperlink. 

     

    If you have other pop-up or modal scripts on your website, that may also cause script conflicts which would result into odd behavior on the form or website. 

    We'll wait for your response.