viewportOffset() not working right

[Sleidia]

Hello,

I've created the function below but it doesn't work as expected.

I have two main menus on my page.
One in the header, one in the footer.
Each menu has a submenu that is shown/hidden on rollover on the main menus.
There are no z-index set on these.
For some reason I don't want to use IDs for menus and submenus.
That's why I use classes instead.

The purpose of this script is to show/hide and element as long as it isn't outside the viewport.
So, if it worked correctly, hovering on the footer menu would show its submenu without affecting the header menu (which is offscreen).

Instead, the footer submenu isn't shown when I hover on the footer menu.

I've done some debugging on FireFox and misteriously, elemOffset.top of the footer menu gets a negative value even when it's in the viewport.

Any idea concerning the reason?

function id_showhide ( e_idclass , e_type , e_action ) {

    if (e_type == 'class') {

    elems = document.getElementsByClassName( e_idclass );
    
        for ( i=0 ; i<elems.length ; i++ ) {

        var elemOffset = elems[i].viewportOffset();

            if(elemOffset.top >= 0){ 
    
                if (e_action == 'hide') {
                
                elems[i].style.display = 'none';
    
                }
                
                if (e_action == 'show') {
 
                elems[i].style.display = '';
                
                }

            }

        }
    
    }
        
}

Thanks for the help!