jQuery - jQuery - запрос:дочерний элемент исчезает с эффектом непрозрачности $('.parent_class') в IE

Question

У меня есть этот html:

<div class="foo parent">
  <div class="child"></div>
</div>

с помощью некоторого css:

    .foo{ 
         position:absolute; 
         left: -117px;
         background:#000000 none repeat scroll 0 0;
         color:#FFFFFF;
         z-index:8;
     }
    .parent{
         top:23px;
         width:100px;
         height:30px;
         display:none;  #parent and child to start out hidden
     }
    .child{
         position:relative;
         left:94px;
         top:5px;
         height:20px;
         width: 110px;
         background:#000000;
         z-index:9;
    }

Я хочу, чтобы этот родитель и потомок слились воедино и в итоге получили непрозрачность: 0.50.Firefox делает это просто отлично, но IE создает проблемы:Когда я выполняю fadeIn() или fadeTo() или даже просто применяю .css('opacity','0.50') к родительскому элементу, родительский элемент визуализируется, а дочерний - нет.

$('.parent').fadeTo('fast',0.50)

--> приводит к исчезновению родителя, но дочерний элемент никогда не появляется.

$('.parent').fadeIn('fast')

--> родитель появляется, дочернего элемента нет

$('.parent').css('opacity','0.55')
$('.parent').show()

--> родительский элемент отображается с непрозрачностью, дочерний элемент никогда не появляется

$('.parent').show()

--> родительский и дочерний элементы отображаются просто отлично (но без анимации или прозрачности).Если я это сделаю

$('.parent').css('opacity','0.55') or $('.parent').fadeTo('fast', 0.50)

после этого родитель получает эффект, а дочерний исчезает.

Как родитель и потомок могут быть анимированы вместе и совместно использовать свойства непрозрачности?

Answer 1

Я добился некоторого успеха, предварительно определив прозрачность элементов, а затем выполнив функцию fadeIn() для родительского элемента.Если я это сделаю:

$('.child').css('opacity', '0.50');
$('.parent').css('opacity', '0.50');
$('.parent').fadeIn('fast');

это дает эффект, к которому я стремлюсь.Как бы это ни было странно, сначала я должен установить непрозрачность для дочернего элемента.Если я установлю их оба одновременно

$('.child, .parent').css('opacity','0.50');

или, если я сначала установлю его для родительского элемента, когда я выполняю fadeIn(), дочерний элемент исчезает, как и раньше.

Answer 2

Почему бы не попробовать указать как родительский, так и дочерний элементы в вашем селекторе, применив effect / css к обоим одновременно:

$('.parent, .child').fadeTo('fast',0.50);