it should be so easy but i'm blind ;(
它应该很容易,但我是盲人;(
What i want to do is: I click on a button. I do some clickstuff, but i also want a blur-transition-css-effekt on another element. so I add a class und then with delay (because this is a nice effect) another class which does a blur-effekt. But now i want so remove the transition-class. This should happen WHEN the blur class is added.. any ideas? This code above needs to be completed with removeClass('.transition') ...
我想要做的是:我点击一个按钮。我做了一些clickstuff,但我也想在另一个元素上使用blur-transition-css-effekt。所以我添加一个类然后延迟(因为这是一个很好的效果)另一个类做一个模糊效果。但现在我想删除转换类。这应该发生在添加模糊类时..任何想法?上面的代码需要用removeClass('。transition')完成...
$('#clicky').click(function(e){
$("#click").addClass("transition").delay(1000).queue(function(){
$('#blurmewithtransition').addClass("blur").dequeue();
});
});
1 个解决方案
#1
you can do it with same .queue function.
你可以使用相同的.queue函数来完成它。
$('#clicky').click(function(e){
$("#clicky")
.queue(function(){
$(this).addClass("transition").dequeue();
})
.delay(1000)
.queue(function(){
$(this).addClass("blur").dequeue();
})
.delay(1000)
.queue(function(){
$(this).removeClass('transition').dequeue();
$(this).removeClass('blur').dequeue();
});
});
inspect html element and you can see how css classes are added and removed, I added delay between add/remove css classes for better look and check.
检查html元素,你可以看到如何添加和删除css类,我添加/删除css类之间的延迟,以便更好地查看和检查。
#1
you can do it with same .queue function.
你可以使用相同的.queue函数来完成它。
$('#clicky').click(function(e){
$("#clicky")
.queue(function(){
$(this).addClass("transition").dequeue();
})
.delay(1000)
.queue(function(){
$(this).addClass("blur").dequeue();
})
.delay(1000)
.queue(function(){
$(this).removeClass('transition').dequeue();
$(this).removeClass('blur').dequeue();
});
});
inspect html element and you can see how css classes are added and removed, I added delay between add/remove css classes for better look and check.
检查html元素,你可以看到如何添加和删除css类,我添加/删除css类之间的延迟,以便更好地查看和检查。