How to create a lightbox that is wider than 300px and mobile friendly? was able to create the lightbox, but it's not working correctly in the mobile p

  • Profile Image
    elle_steiner
    Asked on January 21, 2014 at 03:10 PM

    So I know how to create a lightbox, but it's not working correctly in the mobile platform (iPhone, etc.). How do I make a mobile-friendly lightbox that is wider than 300px?

  • Profile Image
    Cesar
    Answered on January 21, 2014 at 03:51 PM

    I do see you originally asked this on a previous thread. Kindly provide the URL or a description where the form is located on your website. So that we may assist you better. Thank you.

  • Profile Image
    elle_steiner
    Answered on January 21, 2014 at 04:02 PM

    Here is the URL: http://give.brighamandwomens.org/pages/test

    This is just a test, as we plan on creating a more designed form. But we want it to be mobile friendly without the contraints of having to be 300px or less.

  • Profile Image
    jedcadorna
    Answered on January 21, 2014 at 04:42 PM

    Hello,

    Thank you for contacting us. Please try adjusting the width of your form. Here's a sample code:

     

    <script src="//cdn.jotfor.ms.jotform.com/static/feedback2.js?3.2.281" type="text/javascript">

    new JotformFeedback({

    formId:'40143920841952',

    base:'http://jotformpro.com/',

    windowTitle:'Lightbox Test',

    background:'#FFA500',

    fontColor:'#FFFFFF',

    type:false,

    height:500,

    width:400

    });

    </script>

    <a class="lightbox-40143920841952" style="cursor:pointer;color:blue;text-decoration:underline;">Lightbox Test</a>

  • Profile Image
    jedcadorna
    Answered on January 21, 2014 at 04:57 PM

    You can also add a custom CSS and use the @media only screen and (max-device-width: XXpx) depending on which size you want to limit the form.