2

这是jsfiddle。

如您所见，在大红球从右侧淡入之后，我正试图在同一窗口中打开 google.com。相反，google.com 在从右侧淡入开始后大约一秒钟打开。如何让我的 window.location 函数等到淡入完全完成？

是的，我有 JQuery 1.6.2 链接到我的页面。

标记： 

    <a href="http://www.google.com"><img class="animated fadeInRightBig" src="http://www.clipartsfree.net/vector/large/roystonlodge_Simple_Glossy_Circle_Button_Red_Vector_Clipart.png" style="">
     </a>
</body>

查询：

$('.animated').promise().done(function(){
window.location = "http://www.google.com";
});

文森特：我尝试了以下方法，但没有成功。有任何想法吗？ 

$('.animated fadeInRightBig').on('transitionend webkitTransitionEnd oTransitionEnd     otransitionend', function() {
window.location = 'http://www.google.com';
});
4

5 回答 5

1

为什么不使用这样的回调处理程序...

$("#someElement").show('slide', {}, 400, function(){//your code here!});

于 2013-07-30T21:29:04.423 回答
1

我认为这不适promise().done用于 CSS 转换。尝试使用 transitionEnd 事件。

这在不同的浏览器中是不同的，所以你应该看看这个：

如何规范跨浏览器的 CSS3 转换函数？

例如

$('.animated').bind('transitionEnd', function() {
    window.location = 'bla';
});
于 2013-07-30T21:32:33.653 回答
0

您想将队列函数添加到.animated执行重定向的元素上的“fx”队列（默认）。当过渡/动画完成时，将自动调用该队列函数。

$('.animated').queue('fx', function() {
    var url = $(this).attr('href');
    window.location = url;
});

// this will dequeue your added function automatically
$('.animated').addClass('fadeInRightBig');
于 2013-07-30T21:18:10.837 回答
0

这是使用元标记的更简单方法：

<meta http-equiv="refresh" content="6; url=https://www.google.com/">
<meta name="keywords" content="automatic redirection">
于 2013-07-31T19:28:14.443 回答
0

你应该使用这个标志：

animation_end = "webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend";

这对我有用：

animation_end = "webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend";

remove_hallway = function(){
    var hallway = $("#hallway_wrapper");
    hallway.addClass("animated");
    hallway.addClass("zoomOutUp");
    hallway.one(animation_end,function(){
        hallway.css("visibility","hidden");
        hallway.removeClass("zoomOutUp");
        hallway.removeClass("animated");
        $("#room_wrapper").css("visibility","visible");
        create_room(["Default",urls],"fadeInUp");
});

这段代码对我有用。仅当在完成之前调用 zoomOutUp 动画时，它才会执行 hallyway.one() 中的内容。

于 2014-10-05T12:50:30.380 回答