Я применяю некоторую изящную, но базовую анимацию для div и графики через jquery и использую плагин 2d transform для этого, который должен получить доступ к матричному фильтру IE, чтобы выполнить то, что другие браузеры делают естественным образом. Моя проблема в том, что после вызова анимации предыдущий css, установленный с помощью таблицы стилей ИЛИ, неявно установленный с помощью jquery / javascript, игнорируется после манипулирования матричным фильтром.
Панель разработчика IE показывает эту строку на изображении на экране разработчика после завершения анимации:
progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, sizingMethod='auto expand'); ZOOM: 1; TOP: 0px; LEFT: 0px
(что top:0
и left:0
должны сказать left:91px;
и top:-9px;
, как это происходит в FF и Safari)
мой jquery как раз перед этим:
function stage2() {
$("#cs_content2ClipStage3").animate({left:-355},200, function() {
$('#cs_zoomGhost').animate({
scale:.56,
left:'+=70',
top:'-=25'},500, function() {
//replaceZoom technique for piechart
$("#cs_stage3HiddenPie").animate({scale:0},500, function() {
$('#pieChart').attr('src','images/pieChart2.gif');
$('#cs_stage3HiddenPie').animate({scale:.75}, 200);});
$('#cs_stage3HiddenPie').show();
$('#cs_stage2ArrowGrow').show();
$('#cs_stage3HiddenPie').animate({scale:.8}, 500, function() {
$('#arrowGrow').attr('src','images/arrowGrow2.gif');
});
});
$("#stateGraphic").attr('src', 'images/state2_4stage.gif');
}
)};
Таким образом, проблема, только в IE, заключается в том, что позиции: left:'+=70'
и top:'-=25'
не начинаются с размещения css top:17px;
и left:10px;
, заданного с помощью таблицы стилей, и заканчиваются на left:91px
и top:-9px;
.
Элемент имеет макет, он позиционирован (пробовал как относительный, так и абсолютный), и я попытался использовать объявление !important
сверху и слева, но безуспешно.
Я вижу, что преобразование применяется как встроенный стиль с другими инструментами разработчика iE8, поэтому я пытаюсь выяснить, как сказать IE .... поместите этот элемент сюда и анимируйте из этого размещения "
Кажется, я не могу понять, как установить позиционирование CSS, чтобы IE хорошо играл с анимациями.