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

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

2 голосов
/ 14 сентября 2009

У меня есть этот 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)

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

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

Ответы [ 2 ]

3 голосов
/ 14 сентября 2009

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

$('.parent, .child').fadeTo('fast',0.50);
0 голосов
/ 14 сентября 2009

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

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

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

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

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

...