By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
425,971 Members | 907 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 425,971 IT Pros & Developers. It's quick & easy.

FF Error Console: "document.getElementById...has no properties"

P: 7
Hey guys,
I'm building a site for a landscaping business down the street and can't seem to get part of the code functioning correctly. The code fails on line 68 where I make a reference to an iframe's src property. Being that IE does not follow standard and considers an id, name, etc as a qualifying identifier for the document.getElementById object, I double checked to make sure that there's only one instance of id = "servif" and I never use the name attribute anyhow, so don't worry about that. The odd thing is that when you initially execute the failing function it recognizes the iframe's id and adjusts the src appropriately, but when it executes the second time, it's almost as if the id 'servif' has expired and it no longer recognizes the object. The entire FF Error is "document.getElementById('servif') has no properties." Any ideas?

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  2.                       "http://www.w3.org/TR/html4/strict.dtd">
  3.  
  4. <html>
  5. <head>
  6.  
  7. <script type="text/javascript">
  8. var menuDelay = 1;
  9. var menuSpeed = 1;
  10. var offx = parseInt((screen.availWidth - 633)/2);
  11. var roptab = 'closed';
  12. var loptab = 'closed';
  13. var intervlID;
  14.  
  15. function adjust() {
  16. if (navigator.appName == "Microsoft Internet Explorer") {
  17. document.getElementById('pkg').style.position = 'absolute';
  18. offx = parseInt((screen.availWidth - 662)/2);
  19. } else if (navigator.userAgent.indexOf('Firefox') == -1) {
  20. offx = parseInt((screen.availWidth - 644)/2);
  21. } else {
  22. if (document.body.scrollHeight > screen.availHeight) {
  23. offx -= 9;
  24. }}
  25. document.getElementById('contact').style.right = offx + 'px';
  26. document.getElementById('rtab').style.right = offx + 'px';
  27. document.getElementById('history').style.left = (offx + 12) + 'px';
  28. document.getElementById('ltab').style.left = offx + 'px';
  29. }
  30.  
  31. function opMenu(moveWho) {
  32. switch (moveWho) {
  33. case 'contact':
  34. if (roptab == 'closed') {
  35. roptab = 'open';
  36. intervlID = setInterval("moveMenu('" + moveWho + "')",menuDelay);
  37. } else {
  38. roptab = 'closed';
  39. intervlID = setInterval("closeMenu('" + moveWho + "')",menuDelay);
  40. }
  41. break;
  42. case 'history':
  43. if (loptab == 'closed') {
  44. loptab = 'open';
  45. intervlID = setInterval("moveMenu('" + moveWho + "')",menuDelay);
  46. } else {
  47. loptab = 'closed';
  48. intervlID = setInterval("closeMenu('" + moveWho + "')",menuDelay);
  49. }
  50. break;
  51. case 'services':
  52. var servis = document.getElementById('services').style.visibility;
  53. var rtabpos = parseInt(document.getElementById('rtab').style.right);
  54. var ltabpos = parseInt(document.getElementById('ltab').style.left);
  55. var cpos = parseInt(document.getElementById('contact').style.right);
  56. var hpos = parseInt(document.getElementById('history').style.left);
  57. if (servis == '' || servis == 'hidden') {
  58. offx -= 9;
  59. document.getElementById('services').style.visibility = 'visible';
  60. document.getElementById('servif').src='services.html';
  61. if (navigator.appName != "Microsoft Internet Explorer") {
  62. document.getElementById('rtab').style.right = (rtabpos - 9) + 'px';
  63. document.getElementById('contact').style.right = (cpos - 9) + 'px';
  64. document.getElementById('ltab').style.left = (ltabpos - 9) + 'px';
  65. document.getElementById('history').style.left = (hpos - 9) + 'px';
  66. }} else {
  67. offx += 9;
  68. document.getElementById('servif').src='#';
  69. document.getElementById('servif').style.height='0px';
  70. document.getElementById('services').style.visibility = 'hidden';
  71. if (navigator.appName != "Microsoft Internet Explorer") {
  72. document.getElementById('rtab').style.right = (rtabpos + 9) + 'px';
  73. document.getElementById('contact').style.right = (cpos + 9) + 'px';
  74. document.getElementById('ltab').style.left = (ltabpos + 9) + 'px';
  75. document.getElementById('history').style.left = (hpos + 9) + 'px';
  76. }}
  77. break;
  78. default:
  79. alert ('Error: opMenu');
  80. }}
  81.  
  82. function moveMenu(moveWho) {
  83. switch (moveWho) {
  84. case 'contact':
  85. var divRight = document.getElementById('rtab').style.right;
  86. var prsRight = parseInt(divRight);
  87. var endposrt = offx - 182;
  88. document.getElementById('rtabtab').src = 'images/tabs/rtabclose.png';
  89. if (prsRight <= endposrt) {
  90. clearInterval(intervlID);
  91. } else {
  92. document.getElementById('contact').style.right = (prsRight - menuSpeed) + 'px';
  93. document.getElementById('rtab').style.right = (prsRight - (menuSpeed + 14)) + 'px';
  94. }
  95. break;
  96. case 'history':
  97. var divLeft = document.getElementById('ltab').style.left;
  98. var prsLeft = parseInt(divLeft);
  99. var endposlft = offx - 182;
  100. document.getElementById('ltabtab').src = 'images/tabs/ltabclose.png';
  101. if (prsLeft <= endposlft) {
  102. clearInterval(intervlID);
  103. } else {
  104. document.getElementById('history').style.left = (prsLeft - menuSpeed) + 'px';
  105. document.getElementById('ltab').style.left = (prsLeft - (menuSpeed + 14)) + 'px';
  106. }
  107. break;
  108. default:
  109. alert('Error: moveMenu');
  110. }}
  111.  
  112. function closeMenu(moveWho) {
  113. switch(moveWho) {
  114. case 'history':
  115. var divLeft = document.getElementById('ltab').style.left;
  116. var prsLeft = parseInt(divLeft);
  117. document.getElementById('ltabtab').src = 'images/tabs/ltabopen.png';
  118. if (prsLeft >= offx) {
  119. clearInterval(intervlID);
  120. } else {
  121. document.getElementById('history').style.left = (prsLeft + (menuSpeed + 28)) + 'px';
  122. document.getElementById('ltab').style.left = (prsLeft + (menuSpeed + 14)) + 'px';
  123. }
  124. break;
  125. case 'contact':
  126. var divRight = document.getElementById('rtab').style.right;
  127. var prsRight = parseInt(divRight);
  128. document.getElementById('rtabtab').src = 'images/tabs/rtabopen.png';
  129. if (prsRight >= offx) {
  130. clearInterval(intervlID);
  131. } else {
  132. document.getElementById('contact').style.right = (prsRight + (menuSpeed + 28)) + 'px';
  133. document.getElementById('rtab').style.right = (prsRight + (menuSpeed + 14)) + 'px';
  134. }
  135. break;
  136. default:
  137. alert('Error: closeMenu');
  138. }}
  139.  
  140. onload = adjust;
  141. </script>
  142.  
  143. <title>Evergreen Landscape Inc</title>
  144. <META http-equiv="content-type" content="text/html; charset=utf-8">
  145. <link rel="stylesheet" type="text/css" href="css/style.css">
  146. </head>
  147. <body onresize="adjust()">
  148. <div id="egli"><img src="images/menu/egli.png"></div>
  149. <div id="pkg">
  150. <div id="ltab"><img id="ltabtab" src="images/tabs/ltabopen.png" onClick="opMenu('history')"></div>
  151. <div id="contact"><div id="contactinfo">If you're interested in our services, please use the contact information below to get in touch with us.<br><br><span class="bold">Paul Neefe Jr 
  152.  
  153. (Owner):</span><br>Phone - 585.392.9700<br>Fax - 585.395.9202<br><br>We serve the <span class="bold">Monroe</span> and <span class="bold">Orleans</span> areas. If you're not sure 
  154.  
  155. whether we'll come to you just give us a call! Also, don't forget that we're a part of the NYS Nursery Assoc. and participate in the annual Arbor Days celebration!</div></div>
  156. <div id="history"><div id="historyinfo">Established in 1984 by Paul Neefe Jr, Evergreen Landscape is your one stop solution for landscaping, lawn care, outdoor lighting and much much more! Having over 
  157.  
  158. 30 years of experience in the landscaping business means we know what you like. So, take a minute to familiarize yourself with the rest of the website and see what we have to offer! Remember, Evergreen has 
  159.  
  160. worked with such names as Kodak, Max Farash, Xerox and Blue Cross Blue Sheild. If we can satisfy them, than we're sure that we can satisfy you! So, if you're interested just click 'Contact Us' on our menu 
  161.  
  162. and give us a call or fax us a letter.</div></div>
  163. <div id="rtab"><img id="rtabtab" src="images/tabs/rtabopen.png" onClick="opMenu('contact')"></div>
  164. <div id="menu">
  165. <div id="historylnk"><a href="javascript:opMenu('history')" onFocus="this.blur()"></a></div>
  166. <div id="contactlnk"><a href="javascript:opMenu('contact')" onFocus="this.blur()"></a></div>
  167. <div id="serviceslnk"><a href="javascript:opMenu('services')" onFocus="this.blur()"></a></div>
  168. </div>
  169. <div id="services">
  170. <iframe onload="wrkIt()" src="#" height="0px" width="100%" scrolling="no" frameborder="0" id="servif"></iframe>
  171. </div>
  172. </div>
  173. </body>
  174. </html>
  175.  
Jun 19 '07 #1
Share this Question
Share on Google+
4 Replies


acoder
Expert Mod 15k+
P: 16,027
Actually, you should give your iframes names. See this link.
Jun 20 '07 #2

P: 7
Your answer (in a roundabout way) led me to a solution that I suppose will have to suffice. So, thanks. I believe that the problem that occured was due to a combination of browser bugs and malformed code (aka browser incompatibilities with particular forming). Now I'm trying to simply hide and make visible a div within the main page, and it works just fine, but when the page initially loads there's a scroll bar showing in both IE and FF (even though the information is in a 'hidden' state). Any ideas?

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  2.                       "http://www.w3.org/TR/html4/strict.dtd">
  3.  
  4. <html>
  5. <head>
  6.  
  7. <script type="text/javascript">
  8. var menuDelay = 1;
  9. var menuSpeed = 1;
  10. var offx = parseInt((screen.availWidth - 633)/2);
  11. var roptab = 'closed';
  12. var loptab = 'closed';
  13. var intervlID;
  14.  
  15. function adjust() {
  16. if (navigator.appName == "Microsoft Internet Explorer") {
  17. document.getElementById('pkg').style.position = 'absolute';
  18. offx = parseInt((screen.availWidth - 662)/2);
  19. } else if (navigator.userAgent.indexOf('Firefox') == -1) {
  20. offx = parseInt((screen.availWidth - 644)/2);
  21. } else {
  22. if (document.body.scrollHeight > screen.availHeight) {
  23. offx -= 9;
  24. }}
  25. document.getElementById('contact').style.right = offx + 'px';
  26. document.getElementById('rtab').style.right = offx + 'px';
  27. document.getElementById('history').style.left = (offx + 12) + 'px';
  28. document.getElementById('ltab').style.left = offx + 'px';
  29. }
  30.  
  31. function opMenu(moveWho) {
  32. switch (moveWho) {
  33. case 'contact':
  34. if (roptab == 'closed') {
  35. roptab = 'open';
  36. intervlID = setInterval("moveMenu('" + moveWho + "')",menuDelay);
  37. } else {
  38. roptab = 'closed';
  39. intervlID = setInterval("closeMenu('" + moveWho + "')",menuDelay);
  40. }
  41. break;
  42. case 'history':
  43. if (loptab == 'closed') {
  44. loptab = 'open';
  45. intervlID = setInterval("moveMenu('" + moveWho + "')",menuDelay);
  46. } else {
  47. loptab = 'closed';
  48. intervlID = setInterval("closeMenu('" + moveWho + "')",menuDelay);
  49. }
  50. break;
  51. case 'services':
  52. var servis = document.getElementById('services').style.visibility;
  53. var rtabpos = parseInt(document.getElementById('rtab').style.right);
  54. var ltabpos = parseInt(document.getElementById('ltab').style.left);
  55. var cpos = parseInt(document.getElementById('contact').style.right);
  56. var hpos = parseInt(document.getElementById('history').style.left);
  57. if (servis == '' || servis == 'hidden') {
  58. alert (servis);
  59. offx -= 9;
  60. document.getElementById('services').style.visibility = 'visible';
  61. document.getElementById('services').style.height = '100%';
  62. if (navigator.appName != "Microsoft Internet Explorer") {
  63. document.getElementById('rtab').style.right = (rtabpos - 9) + 'px';
  64. document.getElementById('contact').style.right = (cpos - 9) + 'px';
  65. document.getElementById('ltab').style.left = (ltabpos - 9) + 'px';
  66. document.getElementById('history').style.left = (hpos - 9) + 'px';
  67. }} else {
  68. alert (servis);
  69. offx += 9;
  70. document.getElementById('services').style.visibility = 'hidden';
  71. document.getElementById('services').style.height='0px';
  72. if (navigator.appName != "Microsoft Internet Explorer") {
  73. document.getElementById('rtab').style.right = (rtabpos + 9) + 'px';
  74. document.getElementById('contact').style.right = (cpos + 9) + 'px';
  75. document.getElementById('ltab').style.left = (ltabpos + 9) + 'px';
  76. document.getElementById('history').style.left = (hpos + 9) + 'px';
  77. }}
  78. break;
  79. default:
  80. alert ('Error: opMenu');
  81. }}
  82.  
  83. function moveMenu(moveWho) {
  84. switch (moveWho) {
  85. case 'contact':
  86. var divRight = document.getElementById('rtab').style.right;
  87. var prsRight = parseInt(divRight);
  88. var endposrt = offx - 182;
  89. document.getElementById('rtabtab').src = 'images/tabs/rtabclose.png';
  90. if (prsRight <= endposrt) {
  91. clearInterval(intervlID);
  92. } else {
  93. document.getElementById('contact').style.right = (prsRight - menuSpeed) + 'px';
  94. document.getElementById('rtab').style.right = (prsRight - (menuSpeed + 14)) + 'px';
  95. }
  96. break;
  97. case 'history':
  98. var divLeft = document.getElementById('ltab').style.left;
  99. var prsLeft = parseInt(divLeft);
  100. var endposlft = offx - 182;
  101. document.getElementById('ltabtab').src = 'images/tabs/ltabclose.png';
  102. if (prsLeft <= endposlft) {
  103. clearInterval(intervlID);
  104. } else {
  105. document.getElementById('history').style.left = (prsLeft - menuSpeed) + 'px';
  106. document.getElementById('ltab').style.left = (prsLeft - (menuSpeed + 14)) + 'px';
  107. }
  108. break;
  109. default:
  110. alert('Error: moveMenu');
  111. }}
  112.  
  113. function closeMenu(moveWho) {
  114. switch(moveWho) {
  115. case 'history':
  116. var divLeft = document.getElementById('ltab').style.left;
  117. var prsLeft = parseInt(divLeft);
  118. document.getElementById('ltabtab').src = 'images/tabs/ltabopen.png';
  119. if (prsLeft >= offx) {
  120. clearInterval(intervlID);
  121. } else {
  122. document.getElementById('history').style.left = (prsLeft + (menuSpeed + 28)) + 'px';
  123. document.getElementById('ltab').style.left = (prsLeft + (menuSpeed + 14)) + 'px';
  124. }
  125. break;
  126. case 'contact':
  127. var divRight = document.getElementById('rtab').style.right;
  128. var prsRight = parseInt(divRight);
  129. document.getElementById('rtabtab').src = 'images/tabs/rtabopen.png';
  130. if (prsRight >= offx) {
  131. clearInterval(intervlID);
  132. } else {
  133. document.getElementById('contact').style.right = (prsRight + (menuSpeed + 28)) + 'px';
  134. document.getElementById('rtab').style.right = (prsRight + (menuSpeed + 14)) + 'px';
  135. }
  136. break;
  137. default:
  138. alert('Error: closeMenu');
  139. }}
  140.  
  141. onload = adjust;
  142. </script>
  143.  
  144. <title>Evergreen Landscape Inc</title>
  145. <META http-equiv="content-type" content="text/html; charset=utf-8">
  146. <link rel="stylesheet" type="text/css" href="css/style.css">
  147. </head>
  148. <body onresize="adjust()">
  149. <div id="egli"><img src="images/menu/egli.png"></div>
  150. <div id="pkg">
  151. <div id="ltab"><img id="ltabtab" src="images/tabs/ltabopen.png" onClick="opMenu('history')"></div>
  152. <div id="contact"><div id="contactinfo">If you're interested in our services, please use the contact information below to get in touch with us.<br><br><span class="bold">Paul Neefe Jr (Owner):</span><br>Phone - 585.392.9700<br>Fax - 585.395.9202<br><br>We serve the <span class="bold">Monroe</span> and <span class="bold">Orleans</span> areas. If you're not sure whether we'll come to you just give us a call! Also, don't forget that we're a part of the NYS Nursery Assoc. and participate in the annual Arbor Days celebration!</div></div>
  153. <div id="history"><div id="historyinfo">Established in 1984 by Paul Neefe Jr, Evergreen Landscape is your one stop solution for landscaping, lawn care, outdoor lighting and much much more! Having over 30 years of experience in the landscaping business means we know what you like. So, take a minute to familiarize yourself with the rest of the website and see what we have to offer! Remember, Evergreen has worked with such names as Kodak, Max Farash, Xerox and Blue Cross Blue Sheild. If we can satisfy them, than we're sure that we can satisfy you! So, if you're interested just click 'Contact Us' on our menu and give us a call or fax us a letter.</div></div>
  154. <div id="rtab"><img id="rtabtab" src="images/tabs/rtabopen.png" onClick="opMenu('contact')"></div>
  155. <div id="menu">
  156. <div id="historylnk"><a href="javascript:opMenu('history')" onFocus="this.blur()"></a></div>
  157. <div id="contactlnk"><a href="javascript:opMenu('contact')" onFocus="this.blur()"></a></div>
  158. <div id="serviceslnk"><a href="javascript:opMenu('services')" onFocus="this.blur()"></a></div>
  159. </div>
  160. </div>
  161. <div id="services">
  162. <div id="pkg">
  163. <div id="sintro">
  164. <span class="itac">Evergreen Landscape Inc offers a very wide variety of services. Please check our list below. If you don't see what you're looking for we would love for you to call and make a suggestion! Also, please make sure to check out our on-the-job photos for some quality assurance!</span>
  165. </div>
  166. <div id="smlpk">
  167. <div id="lserv">
  168. <br>Boulder Delivery &amp; Placement<br>Bushes &amp; Shrubs<br>Crabgrass Prevention<br>Debris Moving &amp; Hauling<br>Decks<br>Decorative Stone Delivery<br>Landscape Design<br>Site Analysis<br>Patios<br>Fences<br>Walkways<br>Retaining Walls<br>Outdoor Lighting<br>Site Plantings<br>Landscape Consultation<br>Soil Testing<br>Small Excavation<br>Sod Installation<br>Lawn Installation<br>Hydroseeding<br>Lawn Cutting<br>Lawn Feeding<br>Fertilization<br>Insect Control<br>Weed Control<br>Lawn Repair<br>Lawn Dethatching<br>Lawn Aeration<br>Lawn Rolling<br>Large Tree Transplanting<br>Tree Trimming<br>Tree Removal<br>Tree Cabling<br>Trimming &amp; Pruning<br>Spring &amp; Fall Clean Ups<br>Firewood<br>Snowplowing<br>Topsoil Delivery<br>Mulch Delivery<br>
  169. </div>
  170. <div id="rserv">
  171. <br>
  172. <a href="images/full/pic1.jpg" target="_blank"><img src="images/thumb/pic1.gif"></a>
  173. <a href="images/full/pic2.jpg" target="_blank"><img src="images/thumb/pic2.gif"></a>
  174. <a href="images/full/pic3.jpg" target="_blank"><img src="images/thumb/pic3.gif"></a>
  175. <a href="images/full/pic4.jpg" target="_blank"><img src="images/thumb/pic4.gif"></a>
  176. </div>
  177. </div>
  178. </div>
  179. </div>
  180. </body>
  181. </html>
Jun 20 '07 #3

P: 7
Just posted that without using my brain. I'll just use display:none/block
Jun 20 '07 #4

acoder
Expert Mod 15k+
P: 16,027
Oh well, glad you got it working.
Jun 20 '07 #5

Post your reply

Sign in to post your reply or Sign up for a free account.