Not working
It is still not working. I appreciate your help.
Here is a link https://www.nationalhomestore.com/ste_heightcalculator
Code:<style type="text/css"> #hintbox{ /*CSS for pop up hint box */ position:absolute; top: 0; background-color: lightgrey; width: 150px; /*Default width of hint.*/ padding: 3px; border:1px solid black; font:normal 12px Arial; line-height:18px; z-index:100; border-right: 3px solid black; border-bottom: 3px solid black; visibility: hidden; } .hintanchor{ /*CSS for link that shows hint onmouseover*/ font-weight: bold; color: navy; margin: 3px 8px; } </style> <script type="text/javascript"> /*********************************************** * Show Hint script- � Dynamic Drive (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit http://www.dynamicdrive.com/ for this script and 100s more. ***********************************************/ var horizontal_offset="9px" //horizontal offset of hint box from anchor link /////No further editting needed var vertical_offset="0" //horizontal offset of hint box from anchor link. No need to change. var ie=document.all var ns6=document.getElementById&&!document.all function getposOffset(what, offsettype){ var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop; var parentEl=what.offsetParent; while (parentEl!=null){ totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop; parentEl=parentEl.offsetParent; } return totaloffset; } function iecompattest(){ return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body } function clearbrowseredge(obj, whichedge){ var edgeoffset=(whichedge=="rightedge")? parseInt(horizontal_offset)*-1 : parseInt(vertical_offset)*-1 if (whichedge=="rightedge"){ var windowedge=ie && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-30 : window.pageXOffset+window.innerWidth-40 dropmenuobj.contentmeasure=dropmenuobj.offsetWidth if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure) edgeoffset=dropmenuobj.contentmeasure+obj.offsetWidth+parseInt(horizontal_offset) } else{ var windowedge=ie && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18 dropmenuobj.contentmeasure=dropmenuobj.offsetHeight if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure) edgeoffset=dropmenuobj.contentmeasure-obj.offsetHeight } return edgeoffset } function showhint(menucontents, obj, e, tipwidth){ if ((ie||ns6) && document.getElementById("hintbox")){ dropmenuobj=document.getElementById("hintbox") dropmenuobj.innerHTML=menucontents dropmenuobj.style.left=dropmenuobj.style.top=-500 if (tipwidth!=""){ dropmenuobj.widthobj=dropmenuobj.style dropmenuobj.widthobj.width=tipwidth } dropmenuobj.x=getposOffset(obj, "left") dropmenuobj.y=getposOffset(obj, "top") dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+obj.offsetWidth+"px" dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+"px" dropmenuobj.style.visibility="visible" obj.onmouseout=hidetip } } function hidetip(e){ dropmenuobj.style.visibility="hidden" dropmenuobj.style.left="-500px" } function createhintbox(){ var divblock=document.createElement("div") divblock.setAttribute("id", "hintbox") document.body.appendChild(divblock) } if (window.addEventListener) window.addEventListener("load", createhintbox, false) else if (window.attachEvent) window.attachEvent("onload", createhintbox) else if (document.getElementById) window.onload=createhintbox </script> <script language="JavaScript"> <!-- Begin function calc_headroom(form) { var mattress = form.mattress.value; var ceiling = form.ceiling.value; var above = form.above.value; var leg691 = 0 var leg692 = 0 var leg831 = 0 var leg832 = 0 var trim691 = 0 var trim692 = 0 var trim831 = 0 var trim832 = 0 var underceiling = (ceiling - above - mattress - 3); form.under691.value = (69 - 5 - mattress - 3); if (underceiling < form.under691.value) (form.under691.value = underceiling); form.under831.value = (83 - 5 - mattress - 3); if (underceiling < form.under831.value) (form.under831.value = underceiling); form.under692.value = (69 - 10 - mattress - 3); if (underceiling < form.under692.value) (form.under692.value = underceiling); form.under832.value = (83 - 10 - mattress - 3); if (underceiling < form.under832.value) (form.under832.value = underceiling); form.a691.value = (ceiling - mattress - 3 - form.under691.value); form.a831.value = (ceiling - mattress - 3 - form.under831.value); form.a692.value = (ceiling - mattress - 3 - form.under692.value); form.a832.value = (ceiling - mattress - 3 - form.under832.value); leg691 = -(-3 - mattress - 5 - form.under691.value); leg831 = -(-3 - mattress - 5 - form.under831.value); leg692 = -(-3 - mattress - 10 - form.under692.value); leg832 = -(-3 - mattress - 10 - form.under832.value); trim691 = 69 - leg691; trim831 = 83 - leg831; trim692 = 69 - leg692; trim832 = 83 - leg832; form.top691.value = leg691 - 5; form.top831.value = leg831 - 5; form.top692.value = leg692 - 10; form.top832.value = leg832 - 10; minabove30 = "Suggestion: We recommend the Minimum Headroom Above the Mattress is 30 inches."; mattresszero = "Error: The Mattress Thickness must be greater than zero"; mattress40 = "Error: The Mattress Thickness must be less than 40 inches"; if (mattress < 1) alert(mattresszero); // mattress must be greater than zero if (mattress > 40) alert(mattress40); // mattress can't be greater then 40 if (above < 10) alert(minabove30); // minimum headroom above is 30 } // End --> </script> <center> <form method="POST" id="calcform"> <table bgcolor="#ffffff" width="550" border="0" cellpadding="0" cellspacing="0"> <tbody><tr> <td><h2>Height Calculator</h2> <h4>How much headroom will I get?<br /> Enter your specifications below and then press Calculate Headroom. </h4></td> </tr> <tr> <td> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tbody><tr> <td valign="top"> <div> <table width="85%" align="center" cellpadding="2" cellspacing="2"> <tr> <td width="74%">Total Mattress Thickness <a href="#" class="hintanchor" onMouseOver="showhint('Enter the total thickness of the mattress and any mattress topper.', this, event, '200px')" style="text-decoration: none; vertical-align: middle; font-weight: 400;color:#900">[?]</a></td> <td width="26%"><input name="mattress" size="3" value="8" onFocus="select()" maxlength="2"> inches</td> </tr> <tr> <td>Ceiling Height <a href="#" class="hintanchor" onMouseOver="showhint('We need the ceiling height to calculate how much headroom you will get above and underneath.', this, event, '200px')" style="text-decoration: none; vertical-align: middle; font-weight: 400;;color:#900">[?]</a></td> <td><input name="ceiling" size="3" value="96" onFocus="select()"> inches</td> </tr> <tr> <td>Minimum Headroom Above Mattress <a href="#" class="hintanchor" onMouseOver="showhint('We recommend a minimum of 30 inches of headroom above.', this, event, '200px')" style="text-decoration: none; vertical-align: middle; font-weight: 400;;color:#900">[?]</a></td> <td><input name="above" size="3" value="30" onFocus="select()"> inches</td> </tr> <tr> <td> </td> <td> </td> </tr> <tr> <td colspan="2" align="right"><input value="Reset" type="reset" onclick="setTimeout(function(){calc_headroom(document.getElementById('calcform'));}, 100); return true;"> <input value="Calculate Headroom" onClick="calc_headroom(this.form)" type="button"></td> </tr> </table><br /> <br /> <h2><strong><center>Headroom Above & Underneath the Mattress</center></strong></h2><br /> <table width="75%" align="center" cellpadding="2" cellspacing="2"> <tr> <td colspan="2"><strong>Using Single Or Double Safety Rail</strong></td> </tr> <tr> <td><strong>69" Legs</strong></td> <td><strong>83" Legs</strong></td> </tr> <tr> <td>Above <input name="a691" value="32" size="3" style="color: rgb(255, 0, 0); font-weight: bold;"></td> <td>Above <input name="a831" value="18" size="3" style="color: rgb(255, 0, 0); font-weight: bold;"></td> </tr> <tr> <td>Underneath <input name="under691" value="53" size="3" style="color: rgb(255, 0, 0); font-weight: bold;"></td> <td>Underneath <input name="under831" value="67" size="3" style="color: rgb(255, 0, 0); font-weight: bold;"></td> </tr> <tr> <td>Top of Mattress <input name="top691" value="64" size="3" style="color: rgb(255, 0, 0); font-weight: bold;"></td> <td>Top of Mattress <input name="top831" value="78" size="3" style="color: rgb(255, 0, 0); font-weight: bold;"></td> </tr> <tr> <td> </td> <td> </td> </tr> <tr> <td colspan="2" align="center"><input value="Return to Previous Page" onClick="javascript:history.back()" type="button"></td> </tr> <tr> <td colspan="2"> </td> </tr> </table> <center> <p><img src="media/cms/html/loft_drawing_text.gif" width="485" border="0" height="339"></p> <table width="100%" cellspacing="2" cellpadding="2"> <tr> <td height="33%" align="center" valign="top"><h6>Standard 69" Legs<br />Single Safety Rail<br /><img src="media/cms/html/loft_clear_100x97.jpg" width="100" height="97" alt="Standard 69" Legs with Single Safetry Rail"></h6></td> <td height="33%" align="center" valign="top"><h6>Extra Tall 83" Legs<br />Single Safety Rail<br /><img src="media/cms/html/loft_extratall_100x111.jpg" width="100" height="111" alt="Extra Tall 83" Legs with Single Safety Rail"></h6></td> <td width="33%" align="center" valign="top"><h6>Standard 69" Legs<br />Youth (Double) Safety Rails<br /><img src="media/cms/html/youth_sdc_1468x1480_small1.jpg" width="100" height="100" alt="Standard 69" Legs with Youth (Double) Safety Rails"></h6></td> </tr> </table> <p> </p> </center> </div></td> </tr> </tbody></table> </td> </tr> </tbody></table> </form></center> <script> calc_headroom(document.getElementById('calcform')); </script>
CSS Codes
Reply With Quote
Originally Posted by jscheuer1
Bookmarks