gpt4 book ai didi

jquery - 使用 webkitTransitionEnd 编码

转载 作者:可可西里 更新时间:2023-11-01 03:35:15 25 4
gpt4 key购买 nike

我正在编写一个使用事件 webkitTransitionEnd 的网络应用程序(适用于 iPad)。

我想在第二个 过渡结束时回调一个函数。之所以有两个转换是因为其中一个具有 -webkit-transition-delay 属性,因此它们两个动画不会同时结束。由于这是一系列动画,我只想在第二个过渡完成时调用该函数。

我当前(愚蠢的)解决方法是将事件绑定(bind)到一个事件中,这在 jQuery 中看起来像这样。

$(this).bind('webkitTransitionEnd', function(){
$(this).bind('webkitTransitionEnd', function(){
\*some code here*\
$(this).unbind();
});
$(this).unbind();
});

这是可行的,但当有更多动画时它不可用。假设我想在 50 个不同时间结束的动画后回调一个函数。

最佳答案

这没有经过测试,但应该会给你一个好主意。

function waitOnTransition(elem, endIndex, callback){
var transitionIndex = 0;
$(elem).on('webkitTransitionEnd', function(){
if(transitionIndex == endIndex){
callback();
}else{
transitionIndex++;
}
});
}
waitOnTransition('#elemID', 3, function(){
//do stuff
});

你也可以用 curry 来做

function makeTransitionEnd(endIndex){
var endIndex = endIndex;
var out = function(elem, callback){
var transitionIndex = 0;
$(elem).on('webkitTransitionEnd', function(){
if(transitionIndex == endIndex){
callback();
}else{
transitionIndex++;
}
});
});
return out;
}

//make curry
var waitForThreeEnds = makeTransitionEnd(3);
waitForThreeEnds('#elemID', function(){
//do stuff
});

关于jquery - 使用 webkitTransitionEnd 编码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4486336/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com