0

我有一个动画功能,每次单击一堆按钮时都会发生,它们都会发生特定的事情,但动画每次都会发生。现在我已经设置好了,所以它是点击的一部分,所以我每次都重新定义,我如何设置一次,然后为每个按钮说点击时运行该功能?

现在它是这样设置的:

$("#animation1").click(function() {
$("#clinic_850_CONTAINER").animate({
    height: box_TOTAL_ht + 20
}, 300);

$("#staff_850_CONTAINER").animate({
    marginTop: staff_850_CONTAINER_ht * -1
}, 300);

$("#profile_850_HEADER").delay(160).animate({
    top: 10
}, 270);
$("#profile_850_BIO").delay(330).animate({
    top: profile_850_HEADER_ht + 20
}, 400);
$("#profile_850_EDU").delay(450).animate({
    top: profile_850_HEADER_ht + profile_850_BIO_ht + 20
}, 400);
$("#profile_850_CONTACT").delay(570).animate({
    top: profile_850_HEADER_ht + profile_850_BIO_ht + profile_850_EDU_ht + 20
}, 400);

});

像这样设置它在页面加载时运行,你如何防止它运行直到点击发生但保持它们分开

function profile_850_close_animation() {
$("#staff_850_CONTAINER").animate({
    marginTop: 0
}, 300);

$("#clinic_850_CONTAINER").animate({
    height: staff_850_CONTAINER_ht
}, 300);

$("#profile_850_HEADER").animate({
    top: box_TOTAL_ht + 20
}, 300);
$("#profile_850_BIO").animate({
    top: box_TOTAL_ht + 50
}, 450);
$("#profile_850_EDU").animate({
    top: box_TOTAL_ht + 60
}, 450);
$("#profile_850_CONTACT").animate({
    top: box_TOTAL_ht + 70
}, 450);  
}

$("#profile_850_CLOSE").click(profile_850_open_animation());
4

3 回答 3

2

这两种方法都可以:

$("#animation1, #animation2, #animation3").click(function() {
    // existing code
});

或者

function animate() {
    //existing code
}
$("#animation1").click(animate);
于 2012-10-13T00:38:06.540 回答
0

设置要应用这些的类。我需要查看 html 结构以更好地优化您的点击处理程序和动画,但您可以指定相对于动画点击,或者检查 id 以确定要动画的其他元素。

于 2012-10-13T00:34:40.397 回答
-1
function animation() {
// Animation code goes here
}

$("#animation1").click(animation);

此外,您可以使用 jquery 选择器来选择所有按钮并立即分配它们的 onclick 事件。例如,如果所有动画按钮都是类按钮

$(".animation").click(animation);
于 2012-10-13T00:31:44.123 回答