jQuery Datepicker 月份变化的幻灯片效果

Question

我正在使用jQuery Datepicker设置日期并将其显示在输入上。我想创建这样的效果:DZS Calendar因此，当我单击下一个或上一个时，我想使用幻灯片效果动画更改月份。

有办法实现这一点吗？例如:

prev: function(){$month.toggle("slide");}
next: function(){$month.toggle("slide");}

或者:

changeMonth: function(){$this.toggle("slide");}

如何使用 Datepicker 来做到这一点？

Answer 1

您可以使用onChangeMonthYear在月份更改时添加自定义动画。

具体操作方法如下:

$("#textBox1").datepicker({
    onChangeMonthYear: function(year, month, inst) {
        $(".ui-datepicker").show("slide", { direction: "right" }, 600);
    }
});

(假设您将 datePicker 附加到 ID 为“textBox1”的文本框)

这是一个工作的 jsFiddle:

http://jsfiddle.net/7x5ma/

编辑:这是另一个 jsFiddle，其效果类似于您所描述的效果(不是幻灯片效果，而是淡入淡出效果):

http://jsfiddle.net/7x5ma/1/

你只需要像这样改变动画:

$(".ui-datepicker").hide().fadeIn("slow");