CODEWITHSUNDEEP
javascripthtmlinternet-explorer
Antonio
Antonio

Reputation: 137

Some problems in IE11

The problem is that I have created a dynamic navigation... You click on a a-tag which has a function that displays some buttons. I have assigned the function to the a-tag with an addEventListener.

It works in all the browsers, but IE...

When I click the tag, buttons are not becoming visible. And no error appears.

P.S.: I'm spanish btw, I'm sorry about my english :3

/* Javascript */

window.onload = function() {
    var boton_menu = document.getElementById("boton_menu");

    /* Compatibilidad con navegadores web */
    if(boton_menu.addEventListener){
        boton_menu.addEventListener("click", menu_usuario, false);
    } else {
        if(boton_menu.attachEvent){
            boton_menu.attachEvent("onclick", menu_usuario);
        }
    }
}

/* Despliega el menú del usuario*/
function menu_usuario() {
    var boton_menu = document.getElementById("boton_menu");
    var perfil = document.getElementById("perfil");
    var ajustes = document.getElementById("ajustes");
    var desconectar = document.getElementById("desconectar");

    if(boton_menu.className == ""){
        boton_menu.className = "active";
        perfil.className = "active";
        ajustes.className = "active";
        desconectar.className = "active";
    } else {
        boton_menu.className = "";
        perfil.className = "";
        ajustes.className = "";
        desconectar.className = "";
    }
}

Upvotes: 0

Views: 327

Answers (1)

Antonio
Antonio

Reputation: 137

This works in IE:

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="">
        <meta charset="utf-8">
        <meta name="author" content="Antonio Bueno">
        <title>Button Problems</title>
        <style>
            a {background-color: red; color: #FFF; padding: 10px;}
            a.active {background-color: blue;}
        </style>

        <script>
            window.onload = function(){
                var some_button = document.getElementById("some_button");

                if(some_button.addEventListener){
                    some_button.addEventListener("click", DisplayButton, false);
                } else {
                    if(some_button.attachEvent){
                        some_button.attachEvent("onclick", DisplayButton);
                    }
                }
            }

            function DisplayButton(){
                var some_button = document.getElementById("some_button");
                var another_button = document.getElementById("another_button");

                if(some_button.className == ""){
                    some_button.className = "active";
                    another_button.style.display = "none";
                } else {
                    some_button.className = "";
                    another_button.style.display = "inline-block";
                }
            }
        </script>
    </head>

    <body>
        <a id="some_button" class="">Click on me</a>
        <input id="another_button" type="submit" value="example" />
    </body>
</html>

Upvotes: 1

Related Questions