IE getElementById problem ? getElementsByTagName problem ?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • djp1988
    New Member
    • Feb 2008
    • 2

    IE getElementById problem ? getElementsByTagName problem ?

    I have made up a code allowing users to click on a tab and show content in a neat white box, similar to what yahoo have on their homepage.
    I have used 5 divs, all but one set to display:none and the other (the one seen at the start is set to display:block and the script makes the desired div become display:block and makes the div previously display:block to be display:none here is my js code:

    Code:
    function showdiv(div, link) {
    divs = document.getElementById('features').getElementsByTagName('div');
    links = document.getElementById('links').getElementsByTagName('a');
        for (i = 0; i < divs.length; i++) {
            divs[i].style.display = "none";
    	    links[i].style.background = "#FFFFFF";
        }
        document.getElementById(div).style.display = "block";
        link.style.background = "#99FFCC";
    }
    and here is the HTML (simplified to make it more readable):

    [HTML]<div id="blockoffeat ures">
    <p id="links">
    <a href="javascrip t:void(0)" onclick="showdi v('LatestPhoto' , this)" style="backgrou nd:#99FFCC">Lat est Photo</a>
    <a href="javascrip t:void(0)" onclick="showdi v('LatestObs', this)" style="backgrou nd:#FFFFFF">Lat est Obs.</a>
    <a href="javascrip t:void(0)" onclick="showdi v('LatestUpdate s', this)" style="backgrou nd:#FFFFFF">Lat est Updates</a>
    </p>

    <div id="features">

    <div id="LatestPhoto " style="display: block;">
    <h4>Latest Photo</h4>
    <img src="Resources-folder/snakes/IMG_8615.jpg" alt="&copy; djp1988" width="400" height="240" border="1" />
    </div>

    <div id="LatestObs" style="display: none;">
    <h4>Latest Observations</h4>
    <p>22nd Feb. : Malpolon monspessulanus, Psammodromus algirus, Pelophylax perezi</p>
    </div>


    <div id="LatestUpdat es" style="display: none;">
    <h4>Latest Web Site Updates</h4>
    <p >23rd Feb. : New homepage design, I have put the search bar in the menu for handy access, I have put the Sources, Site Info., Books and Links into a drop down menu over the &quot;other&quo t; link and grouped all the usually features in this wonderful JavaScript powered area.
    </div>
    </div>
    [/HTML]

    It works in FF, Safari (mac), Opera (mac) but not on IE any version. I think there is a problem IE have with the getElementById, but how to fix it and is there also a problem with the getElementsByTa gName in IE ?

    The finished product (with a hack i am testing - but i can't test because i am on a mac and have no IE) is found here: www.herpfrance.com
    Last edited by djp1988; Feb 24 '08, 12:20 PM. Reason: simplified even more the html
  • acoder
    Recognized Expert MVP
    • Nov 2006
    • 16032

    #2
    Seems to work on IE7 unless I've missed something.

    Comment

    • djp1988
      New Member
      • Feb 2008
      • 2

      #3
      It shouldn't do... strange, maybe IE doesn't like variable names to be the same as the id names of tags

      Comment

      • acoder
        Recognized Expert MVP
        • Nov 2006
        • 16032

        #4
        When you say it doesn't work, what happens? Is there an error message?

        Comment

        Working...