javascript - 如何使用 jquery mobile 为两个连续的弹出窗口制作动画？

Question

我想用 jquery mobile 做的是当我在第一个弹出窗口上单击一个按钮时，第一个弹出窗口将消失并带有翻转动画，之后第二个弹出窗口将出现并带有相同类型的动画。我试图在事件监听器中使用它:

$("#div_first").popup("close");
$("#div_second").popup("open");

第一个弹出窗口确实消失了。但是第二个弹出窗口没有弹出。我怎样才能用移动 jquery 做到这一点？谢谢!

Answer 1

一旦当前弹出窗口关闭popupafterclose，您需要调用下一个popup。此外，重要的是 data-history="false" 弹出 div，以便不返回历史记录到之前的事件。

$("#pop1").popup("open", {             /* open first popup */
    positionTo: "window",
    transition: "flip"
}).on("popupafterclose", function () { /* open second popup */
     $("#pop2").popup("open", {
       positionTo: "window",
       transition: "flip",
       reverse: true                   /* optional for reverse effect */
   });
});

Demo