What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Lightbox increase the z-index

    Asked by omnigon on May 01, 2012 at 02:55 PM

    I have a lightbox and the navigation is seeing through.  I see that the z-index for the part that is seeing throught is: 10001

     

    I need to increase this so the navigation does not show through.  I would change the z-index of the Navigation but I do not have access to that file.  It is a rather large site and I can't change the css for the navigation.

     

    Is there a way of doing this, that doesn't involve me taking all the source code and css files out?

    Page URL:
    http://form.jotformpro.com/form/21146026869961

  • Profile Image
    JotForm Support

    Answered by Mike_T on May 01, 2012 at 04:29 PM

    Thank you for contacting us.

    Could you please provide us with the URL where we can see that lightbox? Then, we will try to check this further.

    We are looking forward to hearing from you.

  • Profile Image

    Answered by omnigon on May 01, 2012 at 04:31 PM

    http://rangers.nhl.com/club/page.htm?id=65420

  • Profile Image
    JotForm Support

    Answered by Mike_T on May 01, 2012 at 05:43 PM

    Our lightbox is supposed to have high z-index. I am sorry, but I have not found your lightbox on http://rangers.nhl.com/club/page.htm?id=65420 page. Where we can reproduce the problem?

    Thank you for cooperation.

  • Profile Image

    Answered by omnigon on May 01, 2012 at 05:49 PM

    Here is a screen shot on the url i provided: 

    http://awesomescreenshot.com/0554ovs08

     

    YOu see the navigation showing through?  Due to it having a higher z-index than JotForm's Lightbox.

     

    You did not see the lightbox appear when you went to that link?

  • Profile Image
    JotForm Support

    Answered by Mike_T on May 01, 2012 at 06:52 PM

    I am sorry, I was not able to see the lightbox due to AdBlock addon in my browser. Now I can see the problem.

    It seems that I can see different z-index for the form div using our defaul lightbox code on my test page. What code do you use to show your lightbox?

  • Profile Image

    Answered by omnigon on May 01, 2012 at 06:56 PM

    Here is the code:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

    <head>

        <title>Contact Us</title>

    </head>

    <body onload="document.getElementById('lightbox-21146026869961').click()">

    <script src="//jotformpro.com/min/g=feedback" type="text/javascript">

    new JotformFeedback({

    formId:'21146026869961',

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

    windowTitle:'Rangers Popup',

    background:'#FFA500',

    fontColor:'#FFFFFF',

    type:1,

    height:540,

    width:700

    });

    </script>

    <input id="lightbox-21146026869961" style="display:none" type="submit" value="lightbox" >

    </body>

    </html>

  • Profile Image
    JotForm Support

    Answered by Mike_T on May 01, 2012 at 07:10 PM

    Our Developers have recently implemented new version of lightbox script, and it is available from http://jotformpro.com/min/g=feedback2

    I hope that the following change will solve your problem:

    from

    < script src="//jotformpro.com/min/g=feedback" type="text/javascript" >

    to

    < script src="//jotformpro.com/min/g=feedback2" type="text/javascript" >

    Alternatively, you can try the code from our embedding wizard:

    Please give it a try, and let us know if you need any further assistance.