Solved

Javascript doesnt work in IE possible getelementbyid issue

Posted on 2008-06-13
4
228 Views
Last Modified: 2013-11-19
Script closes and opens div tag in firefox, ie 7, and safari, but not in ie 6



javascript code
#######################################################################

      <script language="javascript" type="text/javascript">
                  buildDimmerDiv();
                  function buildDimmerDiv()
                  {
                      document.write('<div id="dimmer" class="dimmer" style="width:'+ window.screen.width + 'px; height:' + window.screen.height +'px; display:none;"><\/div>');
                  }
                  function hideDiv(id){                  
                        document.getElementById(id).style.display = "none";
                        document.getElementById('dimmer').style.visibility = "hidden";
                        document.getElementById('dimmer').style.display = "none";
                  }

html code
############################################################
<div class="dimming" name="windowcontent" id="windowcontent" style="position: absolute; top:20%; left:40%; display:none;">
            <form method="post" style="margin: 0px;" action="login.php" name="loginform" id="loginFormId">
                  <input name="act[login]" id="act[login]" value="Login" type="hidden">
                  <table align="center">
                  <tr>
                        <td align="left"><span class="blue_txt">LOG IN</span></td><td colspan="2" align="left"><span class="message_error" id="errorSpan" style="display: none;text-align: left;">Login error - wrong user name</span></td>
                        <td align="right" colspan="2"><span class="blue_txt"><a href="" onclick="hideDiv('windowcontent');return false;"><b>x</b></a> </span></td>
                  </tr>
                  <tr style="padding: 10px;">
                        <td><span class="blue_txt">USERNAME:</span></td>
                        <td>
                        <input style="padding: 6px 0px 0px 10px; background: url(design/pic/uname.jpg) center center no-repeat; height: 19px; width: 187px;" id="login1" name="login" value="" class="input" type="text"></td>
                        <td rowspan="2" style="padding: 6px 6px 5px 20px; background: url('design/pic/login_cell_bg.jpg') no-repeat right;">
                              <a onclick="tryLogin();return false;" onmouseout="changeImageMy('login_button','design/pic/login.jpg');return true;" onmouseover="changeImageMy('login_button','design/pic/login_over.jpg');return true;" href="#">
                                 <img id="login_button" name="act[login]" src="design/pic/login.jpg" alt="login">
                              </a>
                        </td>
                        
                  </tr>
                  <tr style="padding: 10px;">
                        <td><span class="blue_txt">PASSWORD:</span></td>
                        <td><input id="login2" name="pass" value="" class="input" style="padding: 6px 0px 0px 10px; background: url(design/pic/uname.jpg) center center no-repeat; height: 19px; width: 187px;" type="password"></td>
                  </tr>
                  </table>
            </form>
          <div style="display:none; vertical-align: middle; margin: 10px;" id="formhide2" align="center">                      
                <table class="pbar3" cellpadding="0" cellspacing="0" style="vertical-align: middle;">
                <tr>
                <td>
                      <span id="progress1">&nbsp; &nbsp;</span>
                      <span id="progress2">&nbsp; &nbsp;</span>
                      <span id="progress3">&nbsp; &nbsp;</span>
                      <span id="progress4">&nbsp; &nbsp;</span>
                      <span id="progress5">&nbsp; &nbsp;</span>
                      <span id="progress6">&nbsp; &nbsp;</span>
                      <span id="progress7">&nbsp; &nbsp;</span>
                      <span id="progress8">&nbsp; &nbsp;</span>
                      <span id="progress9">&nbsp; &nbsp;</span>
                </td>
                </tr>
                </table>      
                {literal}<script type="text/javascript">do_prog(9,200);</script>{/literal}
          </div>
</div>
0
Comment
Question by:spotcher
  • 2
4 Comments
 
LVL 82

Expert Comment

by:hielo
ID: 21784021
This:
<\/div>

should be:
</div>

but I doubt that will fix the issue. You need to post the code that the browser sees/gets so that we can see what the browser sees.
0
 

Author Comment

by:spotcher
ID: 21784049
it was at that but I was using html validation software and it told me to place it like that if its inside the javascript. I changed it got rid of vlidation error, and javascript still works in all browsers but IE.
0
 
LVL 9

Accepted Solution

by:
zemond earned 500 total points
ID: 21784122
you should move the call under the function

Replace    

            

                  buildDimmerDiv();

                  function buildDimmerDiv()

                  {

                      document.write('<div id="dimmer" class="dimmer" style="width:'+ window.screen.width + 'px; height:' + window.screen.height +'px; display:none;"><\/div>');

                  }
 

With
 

                  function buildDimmerDiv()

                  {

                      document.write('<div id="dimmer" class="dimmer" style="width:'+ window.screen.width + 'px; height:' + window.screen.height +'px; display:none;"><\/div>');

                  }

                  buildDimmerDiv();

Open in new window

0
 

Author Closing Comment

by:spotcher
ID: 31467143
Thanks i moved it to the bottom of all functions works great :)
0

Featured Post

Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

747 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now