Максимальная непрозрачность Tween в ie8

Я пытаюсь использовать сценарий tween max и superscroll, чтобы обрабатывать непрозрачность моего содержимого при прокрутке.

Это прекрасно работает в chrome, safari, ff, ie9 и ie10. Однако у меня проблема с ie8.

Вы можете увидеть проблему на этой странице: http://www.promenade-sainte-catherine.com/localisation

При прокрутке вниз в ie8 меню слева меняет свой цвет на белый. Это нормально, и как только анимация закончится, она снова станет зеленой.

Это мой css:

   body #menuGaucheContainer #menuGauche .logoPSC {
    position: relative; zoom:1;}
    /* line 270, sass/partial/_global.scss */
    body #menuGaucheContainer #menuGauche .logoPSC #log1, body #menuGaucheContainer #menuGauche                .logoPSC #log2 {
      opacity: 0;
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
      position: absolute;
      top: -109px;
      left: 75px; }

И это вызов tweenmax

   controller.addTween('#aucoeurducentrevilleContainer', 
        TweenMax.fromTo(jQuery('#img2Localisation'), 1,
            {css:{opacity:0}},
            {css:{opacity:1}}), 
        200);
    controller.addTween('#aucoeurducentrevilleContainer', 
        TweenMax.fromTo(jQuery('#log2'), 1,
            {css:{opacity:0}},
            {css:{opacity:1}}), 
        200);

Если я удалю фильтр: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);" линия. Тогда это работает хорошо, но ничто не имеет нулевой непрозрачности в начале страницы.

Если я добавлю css:{opacity:X, alpha:X}, ничего не изменится,

Если я изменю {css:{opacity:0}} на {css:{alpha:0}}, это вроде как сработает, но у меня все еще есть некоторые проблемы.

У кого-нибудь есть идеи?

Спасибо


person Thoma Biguères    schedule 26.04.2013    source источник
comment
Похоже, вы используете ОЧЕНЬ старую версию файлов GreenSock (TweenMax). Вы обязательно должны обновиться - это может решить проблему прямо здесь. greensock.com/?download=GSAP-JS В противном случае мне было бы любопытно если анимация с непрозрачностью: 0,99 вместо 1 решает проблему за вас.   -  person Jack    schedule 28.04.2013
comment
Да, это полностью помогло: непрозрачность: 0,99 вместо 1. Большое спасибо. Есть ли способ принять ваш ответ, чтобы вы могли получить баллы (в Stackoverflow я еще многого не понимаю)   -  person Thoma Biguères    schedule 02.05.2013
comment
Конечно, я просто добавлю это как ответ, который вы можете принять. Я, вероятно, должен был сделать это изначально - извините.   -  person Jack    schedule 06.05.2013


Ответы (2)


Похоже, вы используете ОЧЕНЬ старую версию файлов GreenSock (TweenMax). Вы обязательно должны обновиться - это может решить проблему прямо здесь. http://www.greensock.com/?download=GSAP-JS В противном случае попробуйте анимацию с непрозрачностью: 0,99 вместо 1 решит проблему за вас. Но опять же, я почти уверен, что обновление поможет, потому что, если мне не изменяет память, для этого конкретного сценария какое-то время назад в обновлении TweenMax применялся обходной путь.

person Jack    schedule 06.05.2013
comment
Я не хотел обновлять файл, опасаясь других проблем, которые могут возникнуть из-за этого. Так что решение 0,99 вместо 1 сработало отлично :). Спасибо. - person Thoma Biguères; 06.05.2013

У меня также была эта проблема с новой версией Greensock, и это не из-за плагина, а из-за CSS. Ошибка в начале утверждения:

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
opacity:    0;

Хотя это совершенно нормально, если вы не хотите поддерживать IE7, это нарушит правила анимации TweenMax. Исправление состоит в том, чтобы добавить правило CSS IE5-IE7, даже если вы не будете поддерживать IE7 в целом:

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity:    0;
person Ruben Bristian    schedule 19.11.2013