javascript problem in firefox

Question

hi. i'm using this javascript to toggle the visibility of some divs which have different ids. it works how i want in google chrome and even in internet explorer but in firefox when i hover the links the divs won't change their visibility. javascript:

function loaded() { // this one is called in the body tag
    about.style.visibility='visible';
    last = about;
}

function toggle_visibility(id) {
    var e = document.getElementById(id);
    if (last!=e) {
        e.style.visibility = 'visible';        
        last.style.visibility='hidden';
        last = e;
    }
}

css for divs:

#about {
    background-color:#D580FE;
    width:850px;
    height:500px;
    margin-left:auto;
    margin-right:auto;    
    margin-top:40px;
}

#portofoliu {
    background-color:#FF0000;
    width:850px;
    height:500px;
    margin-left:auto;
    margin-right:auto;    
    margin-top:-500px;
    visibility:hidden;
}

Answer 1

try switching from visibility:visible and visibility:hidden to display:block and display:none

so...

function loaded() { // this one is called in the body tag  
about.style.display='block';  
last = about;  

}

function toggle_display(id) {
var e = document.getElementById(id);
if (last!=e) {
    e.style.display = 'block';        
    last.style.display='none';
    last = e;
}

}

css for divs:

#about {
background-color:#D580FE;
width:850px;
height:500px;
margin-left:auto;
margin-right:auto;    
margin-top:40px;

}

#portofoliu {
background-color:#FF0000;
width:850px;
height:500px;
margin-left:auto;
margin-right:auto;    
margin-top:-500px;
display:none;

}

Answer 2

• Try using another variable other than e. It is used as the window.event variable in Firefox.
• Your code should work.
  If the mouseover event is not being fired, you have a problem in your JavaScript elsewhere.
• Either post a page somewhere, post more info, or download Firebug and debug it yourself.