CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Tiedt Tech
Tiedt Tech

Reputation: 717

Jquery attr not working Internet Explorer

I have the code below that clicking on an image hides a div. Works perfectly, but does not work in IE ...

Why?

http://jsfiddle.net/mtsys/6qAfp/

codes:

$(document).ready(function () {       
    $('.fechar').click( function() { alert('testes'); $(".nav").attr("hidden",true); });
    $('.mais').click( function() {
        var status = $(".nav").attr("hidden");
        if (status)
        {
            $(".nav").attr("hidden",false);
        }
        else
        {
            $(".nav").attr("hidden",true);
        }
    });
});

HTML:

<div class="header">
    Estágio    
    <div class="mais"></div>
</div>
<div class ="parent">     
    <div class="content">        
        <div id="map_canvas" style="width: 100%; height: 100%;"></div>
    </div>
    <div class="nav"><div class="fechar"></div><div id="dadosDiv"></div></div>   
</div>

tks

Upvotes: 0

Views: 748

Answers (2)

Arun P Johny
Arun P Johny

Reputation: 388316

Use .hide() and toggle() to change the display of the elements

$('.fechar').click(function () {
    $(".nav").hide()
});
$('.mais').click(function () {
    $(".nav").toggle()
});

Demo: Fiddle

Upvotes: 4

SW4
SW4

Reputation: 71160

Why not change your JS to:

    $('.fechar').click( function() { alert('testes'); $(".nav").hide(); });
    $('.mais').click( function() {
        $(".nav").toggle();
    });

This will not only simplify your code but utilise jQuery's inbuilt function for toggling content visibility. Incidentally, the issue was the hidden attr reference, this should have been .css('hidden',true) if you want to go down that route...

Upvotes: 1

Related Questions