圣诞节来临日历

Question

我有一个出现日历的愿景，那里有真实窗户的图片，颤抖，当用户点击图片时，颤抖打开，露出他们背后的东西。

我该怎么做？我想我可以在jQuery中使用原始的slideDown方法。但是有一个slideLeft和slideRight吗？还是一个openDoor，每个颤抖都在轴上旋转？

这将是一个div，它同时向左右两个开放过渡。

Answer 1

我很想看到其他解决方案而且我发现了这个...我想虽然我分享了，但是没有很多有用的例子。

我今天写了这个：http://www.ucc.org/advent/calendar/

修改自：http://web.enavu.com/demos/curtain/

Answer 2

核心jQuery只有一个slideDown和slideUp（jQuery的许多不幸的特性之一）。但是有jQuery UI（用户界面），它是jQuery框架的扩展，您可以使用它实现这一目标。它具有滑动效果，可接受方向和速度参数（请参阅http://docs.jquery.com/UI/Effects/Slide上的文档）。

一个例子是

$("leftshutter").hide("slide", { direction: "left" }, 1000);
$("rightshutter").hide("slide", { direction: "right" }, 1000);

虽然这可能恰恰相反。

我不确定openDoor需要什么样的动作。如何将Z轴周围的旋转投影到二维平面？如果你用数学方法计算出来，可能有办法使用核心.animate()函数来实现它，它会动画一组自定义的CSS属性。然而，这可能仅限于导致矩形的操作而不是您可能想要的菱形。