[英]animationEnd event handler - event heard two times
I have a code: 我有一个代码:
$('#sectionName').on('animationend webkitAnimationEnd oAnimationEnd', function () {
alert("Hello");
});
which is meant to trigger the alert when animation of #sectionName ends. 这是为了在#sectionName动画结束时触发警报。
It does its job but it is also triggered first time the website is launched. 它可以完成工作,但也会在网站首次启动时触发。
Is there a way to prevent it? 有办法预防吗? Some way to trigger this alert only when the animationend event is heard for the second time? 是否只有在第二次听到animationend事件时才触发此警报?
PS I am using wow.js, so the #sectionName object slides in, after scrolling to certain page point, and then I want the alert to be displayed. PS:我使用的是wow.js,因此在滚动到某些页面点后,#sectionName对象会滑入,然后我希望显示警报。
Try it simple: 简单尝试:
Var firstTime = true
$('#sectionName').on('animationend webkitAnimationEnd oAnimationEnd', function () {
if(firstTime){
firstTime = false;
return;
}
alert("Hello");
});
You can use wow.js callback
to catch an animation is started: 您可以使用wow.js callback
来捕获启动的动画:
var sections = ['sectionName', 'sectionName2']
var wow = new WOW({
callback: function(box) {
var $box = $(box);
if ( sections.indexOf( $box.attr('id') ) >= 0 ) {
$box.on('animationend webkitAnimationEnd oAnimationEnd', function () {
alert("Hello");
});
}
}
}).init();
[ https://jsfiddle.net/6g01kLsh/ ] [ https://jsfiddle.net/6g01kLsh/ ]
Only tested for animationend
and webkitAnimationEnd
. 仅针对animationend
和webkitAnimationEnd
进行了测试。
var isWebkitAnim = window.onanimationend === undefined && window.onwebkitanimationend !== undefined
var animationEndEvent = isWebkitAnim ? 'webkitAnimationEnd' : 'animationend'
$('#sectionName').on(animationEndEvent, function() {
alert("Hello")
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.