Search code examples
javascriptjquerysafari6

Hide and show function not working in Safari


This function should stop displaying the #bt_pagamento and start showing the #bt_loading. But Safari (version 6) is the only browser that this function doesn't work. In early versions of Safari (version 5.1.9 Mac and 5.1.7 Win) it worked perfectly.

$("#bt_pagamento").click(function () {
$(this).css({'display':'none'});
$("#bt_loading").show();
});

Does anyone know a work around for this?


Solution

  • CSS

    <style>
    .hide { display: none; }
    </style>
    

    HTML

    <a href="#" id="bt_pagamento">link</a>
    <div id="bt_loading" class="hide">
        this is bt_loading
    </div>
    

    JS

    $(document).ready(function() {
        $("#bt_pagamento").click(function (e) {
            e.preventDefault();
            $(this).addClass('hide');
            $("#bt_loading").removeClass('hide');
        });
    });