positionFixedLightbox_ID_12675931234

Step 1. Include the following code in the head of the page within which the lightbox form is to be embedded:


<style type="text/css">
html, body {
    text-align: center;
}

#wrapper {
    left:0; right:0;
    top:0; bottom:0;
    text-align:left;
}

div div {
    margin:auto;
    left:0; right:0;
    top: 0; bottom: 0;
    position:fixed !important;
    width:618px !important;
    height:557px !important;
}

div div div {
    margin:auto;
    left:0; right:0;
    top:0; bottom:0;
    position:fixed !important;
    width:600px !important;
    height:539px !important;
}

div div div table tbody tr td {
    padding-bottom:500px;
    padding-right:110px;
    font-size: 12px !important;
    font-weight:bold !important;
    font-family: Verdana, Arial, sans-serif;
}

iframe {
    margin-top:41px;
}
</style>


Step 2. Just after the opening <body> tag place <div id="wrapper"> and just before the closing </body> tag place </div> like this:

<body>
    <div id="wrapper">

        Contents of the page go here...

    </div>
</body>


Step 3. Change the lightbox code to the following:

<script src="http://www.jotform.com/min/g=feedback" type="text/javascript">
new JotformFeedback({
formId:'12674438230',
base:'http://www.jotform.com/',
windowTitle:'Order Form Pop Up (Hit [Esc] or [F5] to exit)',
background:'#690',
fontColor:'#FFFFFF',
type:false,
});
</script>
<a class="lightbox-12674438230" style="cursor:pointer;color:blue;text-decoration:underline;">Order Form Pop Up</a>


Step 4. Replace each instance of 12674438230 in the lightbox code with 12675931234