Javascript IE中未触发transistionend事件
我一直在努力让css转换与IE一起工作。出于某种原因,transitionend事件在除IE之外的所有浏览器中都会触发。 我在这里创建了一个小示例,其中显示了问题: 以下是转换结束时应调用的代码:Javascript IE中未触发transistionend事件,javascript,css,internet-explorer,Javascript,Css,Internet Explorer,我一直在努力让css转换与IE一起工作。出于某种原因,transitionend事件在除IE之外的所有浏览器中都会触发。 我在这里创建了一个小示例,其中显示了问题: 以下是转换结束时应调用的代码: $('.box-to-illuminate').mousedown(function () { $(this).addClass('holding'); $(this).bind('transitionend', f
$('.box-to-illuminate').mousedown(function () {
$(this).addClass('holding');
$(this).bind('transitionend', function () {
$(this).off('transitionend');
$(this).removeClass('holding');
}
);
});
在Chrome和Firefox中,框在transitionend事件中变回黄色。这在IE10+11中从未被调用
如果有人能解决这个难题,我将非常感激
谢谢这是因为它不支持'transitionnd'
,但它支持'change'
。虽然IE确实支持变更事件,但它是。请注意,由于IE 9-不支持转换,因此在这种情况下,功能将受到限制:
$(this).bind('change', function () {
$(this).off('change');
...
});
当我使用addEventListener(“transitionend”
)时,For me可以工作。
如果与框架绑定,则“MSTransitionEnd”和“transitionEnd”都不起作用,因此结果可能取决于3年后的特定框架/verion
我遇到了这个问题,在IE 10/11中,如果转换发生在“display:none”元素或伪元素(如:before)上,transitionend将不会启动
在JSFIDLE中,转换在.box中定义为照亮。保持:before。您可以重新构造代码,以便在.box上定义转换。我通常觉得更容易定义
.box-to-illuminate {
transition: transform 1.4s;
}
.box-to-illuminate.holding {
transform: rotate(0);
}
这将在非伪元素上触发transitionend事件,而实际的转换“没有任何作用”。谢谢,但该示例也不适用于IE 10和IE 11@HankRearden我在IE 10和Edge上测试了transitionend
,效果很好,你确定你没有在以前版本的IE上以兼容模式运行吗?是的,我确定我正在运行IE11。如果在Chrome中运行该示例,您将看到颜色在转换后变回黄色。IE的情况并非如此。