Melros
Melros

Reputation: 1213

fadeToggle on a div with divs inside doesn't work in IE as expected

I have this setup:

<div class="fadetoggle">
  <div>Content</div>
  <div>Content</div>
</div>

And this code:

$(".button").click(function () {
  $(".fadetoggle").fadeToggle('slow');
});

In all modern browser I tested it so far it works but in IE8 the div "fadetoggle" just shows/hide. If I use fadeToggle on only a div without children it works in IE8.

How comes? And is there a way to make fadeToggle in IE with my setup working?

Upvotes: 2

Views: 1719

Answers (2)

Melros
Melros

Reputation: 1213

Ok, here's what was happening:

  1. IE doesn't like fades on fixed elements. So I "wrapped" them up in a div and got it to work with this:

    $("div-wrapper").children().fadeToggle();

  2. On another div inside a "group-div" I had declared position:relative & float:right at the same time in the css. Of course this is redundant anyways and so it was irretating IE I guess.

So I just removed position:relative and everything works fine now.

Thank you.

Upvotes: 3

Sreenath Plakkat
Sreenath Plakkat

Reputation: 1785

check this not sure frnd

   $(".button").click(function () {
if($(fadetoggle).is(":visible"))//IE8 always evaluates to true.
     $(fadetoggle).hide();
else
     $(fadetoggle).show();
});

chage this to satisfy your needs

Upvotes: 1

Related Questions