0

我想在显示 (q2) 的同时为链接 (q2 ul li a) 运行动画,q2 将在页面加载时隐藏。

$('.q2').fadeIn(function(){
$('.q2 ul li a').animate({ borderSpacing : 1 }, {
    step: function(now,fx) {
    $(this).css('-webkit-transform','rotate('+(-1*200*now+200)+'deg) scale('+(now)+')'); 
    $(this).css('-moz-transform','rotate('+(-1*200*now+200)+'deg) scale('+(now)+')');
    $(this).css('transform','rotate('+(-1*200*now+200)+'deg) scale('+(now)+')');    
    },
    duration:1500 }, 'linear')
});
});

在 css 中:

ul li a {
    border-spacing: 0;
}
4

1 回答 1

1

在您的代码中,动画将在$('.q2')可见后执行,因为您将此动画放在 fadeIn 函数的回调中。也许它应该是这样的:

$('.q2').fadeIn(1500);
$('.q2 ul li a').animate({ borderSpacing : 1 }, {
    step: function(now,fx) {
        $(this).css('-webkit-transform','rotate('+(-1*200*now+200)+'deg) scale('+(now)+')'); 
        $(this).css('-moz-transform','rotate('+(-1*200*now+200)+'deg) scale('+(now)+')');
        $(this).css('transform','rotate('+(-1*200*now+200)+'deg) scale('+(now)+')');    
    },
    duration:1500 }, 
    'linear')
});
于 2013-06-04T08:53:21.673 回答