BUG: Problem Toggling Display of Absolute <SPAN> in IE 4.01

 Last reviewed: February 25, 1998
Article ID: Q181676
The information in this article applies to:
  • Microsoft Internet Explorer (Programming), version 4.01

SYMPTOMS

If you have HTML that contains a <SPAN> tag that, when clicked, hides and shows another <SPAN> tag, the second <SPAN> tag will show correctly. However, it will not hide correctly, unless the Internet Explorer display is refreshed. This occurs only if you are using the Display style to hide and show the contents of your <SPAN> tag.

RESOLUTION

Use the Visibility style instead of the Display style.

STATUS

Microsoft has confirmed this to be a bug in the Microsoft products listed at the beginning of this article. We are researching this bug and will post new information here in the Microsoft Knowledge Base as it becomes available.

MORE INFORMATION

Steps to Reproduce Behavior

  1. Create a Web page with the following HTML:

    Sample Code ----------- 

          <HTML>

             <SPAN style="position:absolute; cursor:hand; top:0; left:0;
               width:120; height:18; background-color:C0C0C0;
               color:000000;"
               id="here">
         &nbsp;Click Here
         </SPAN>

         <SPAN style="display:none; position:absolute; top:0; left:0;"
               id="foo">
            <SPAN style="position:absolute; top:18; left:0; width:120;
               height:18" id="R8">
            &nbsp;Open
            </SPAN>
         </SPAN>

         <SCRIPT LANGUAGE=JScript>
            function go()
            {
               if (foo.style.display == "none")
                  foo.style.display = "";
               else
                  foo.style.display = "none";
            }

            here.onclick = go;
         </SCRIPT>
      </HTML>


  2. Click "Click Here". The contents of the second <SPAN> tag appear.


  3. Click "Click Here" again. The contents of the second <SPAN> tag should
   disappear, but they do not.


  4. Change the width of your browser. The contents of the second <SPAN> tag
   disappear.

    

    

To workaround this problem, change all occurrences of the Display style to
Visibility, as in the following HTML:



Sample Code

 



   <HTML>
      <SPAN style="position:absolute; cursor:hand; top:0; left:0;
            width:120; height:18; background-color:C0C0C0; color:000000;"
            id="here">
      &nbsp;Click Here
      </SPAN>

      <SPAN style="visibility:hidden; position:absolute; top:0; left:0;"
            id="foo">
         <SPAN style="position:absolute; top:18; left:0; width:120;
            height:18" id="R8">
         &nbsp;Open
         </SPAN>
      </SPAN>

      <SCRIPT LANGUAGE=JScript>
         function go()
         {
            if (foo.style.visibility == "hidden")
          foo.style.visibility = "visible";
            else
               foo.style.visibility = "hidden";
         }

         here.onclick = go;
      </SCRIPT>
   </HTML>


REFERENCES

 


For more information on Dynamic HTML, see:




	
			
	















	






Additional query words: SPAN display style

Keywords          : AXSDKIESripting kbcode

Technology        : kbInetDev

Version           : winnt:4.01;win95:4.01

Platform          : Win95 winnt

Issue type        : kbbug

Solution Type     : kbpending








THE INFORMATION PROVIDED IN THE MICROSOFT KNOWLEDGE BASE IS
PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND.  MICROSOFT DISCLAIMS
ALL WARRANTIES, EITHER EXPRESS OR IMPLIED, INCLUDING THE WARRANTIES
OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE.  IN NO
EVENT SHALL MICROSOFT CORPORATION OR ITS SUPPLIERS BE LIABLE FOR
ANY DAMAGES WHATSOEVER INCLUDING DIRECT, INDIRECT, INCIDENTAL,
CONSEQUENTIAL, LOSS OF BUSINESS PROFITS OR SPECIAL DAMAGES, EVEN IF
MICROSOFT CORPORATION OR ITS SUPPLIERS HAVE BEEN ADVISED OF THE
POSSIBILITY OF SUCH DAMAGES.  SOME STATES DO NOT ALLOW THE EXCLUSION
OR LIMITATION OF LIABILITY FOR CONSEQUENTIAL OR INCIDENTAL DAMAGES
SO THE FOREGOING LIMITATION MAY NOT APPLY.






	
	Last reviewed:  February 25, 1998
	

	© 1998 Microsoft Corporation. All rights reserved. Terms of Use.