Eddy
Eddy

Reputation: 566

Why does my toggle not work in Internet Explorer?

I am toggling an element out and back into screen. It works nicely but not in Explorer. How do I make it also explorer compatible. Can you please help?

See my example here:

JSFIDDLE

/*START makes text-over-photo div collapse and expand horizontally*/
$(document).ready(function() {
    $("#togglebutton").click(function() {
        var $container = $('#text-over-photo-container');
        $container.toggleClass('hide2');
    });
});


$('#togglebutton').click(function() {
    $(this).toggleClass('glyphicon glyphicon-remove');
    $(this).toggleClass('glyphicon glyphicon-plus');
});

Upvotes: 1

Views: 349

Answers (1)

razemauze
razemauze

Reputation: 2676

Try prefixing your transition and transform: JSFIDDLE

EDIT: I just tested my fiddle in IE, and found out that the calc in the translate was the issue. I have removed the calc and added a margin to even out the 60px, instead, which works in IE11: JSFIDDLE

Upvotes: 3

Related Questions