Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Apr 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    very strange innerHTML behaviour

    Hello, I have programmed the following:

    <html>
    <body>
    <head>
    <script type="text/javascript">
    function expandTaskMenu()
    { var x=document.getElementById('taskMenu');
    x.innerHTML = "<table border=1 cellpadding=0 cellspacing=0 width=85%>";
    x.innerHTML += "<tr><td>align=center width=100%><b><a href='javascript:collapseTaskMenu()' style='text-decoration: none'>Collapse</a></b></td></tr>";
    x.innerHTML += "<tr><td>Sample 1</td></tr><tr><td>Sample 2</td></tr></table>";
    }

    function collapseTaskMenu()
    { var x=document.getElementById('taskMenu');
    x.innerHTML = "<table border=0 cellpadding=0 cellspacing=0 width=85%>";
    x.innerHTML += "<tr><td align=center width=100%><b><a href='javascript:expandTaskMenu()' style='text-decoration: none'>Expand</a></b></td></tr></table>";
    }

    </script>
    </head>

    <table border=1>
    <tr><td id="taskMenu">
    <table border="0" cellpadding="0" cellspacing="0" width="85%">
    <tr>
    <td align="center"width="100%">
    <b><a href="javascript:expandTaskMenu()">Original</a></b>
    </td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
    </body>
    </html>


    When in Mozilla, with each subsequent click, the text moves down the page.
    In IE, the text does not move but the "submenu" items print sideways instead
    of down. I have no idea why either of these things happen. As I do not do much Javascript programming, any help would be very much appreciated.
    Thank-you.

  • #2
    Regular Coder
    Join Date
    Apr 2005
    Location
    Lisbon, CT
    Posts
    339
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I am not certain this is causing you a problem but perhaps it is confusing the browsers.

    Code:
    x.innerHTML = "<table border=1 cellpadding=0 cellspacing=0 width=85%>";
    In the above statement since you are not delimiting the attribute values you wind up with .....width=85%>. Maybe the browser thinks some server side stuff is supposed to be happening. Try rearranging your statements such that the % is not at the end of the line next to the >. Just a wild guess, could be of no importance.

    BaldEagle

  • #3


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •