Question

我正在尝试为jQuery Mobile Popup执行向下滑动过渡。我使用以下实现：

  $(element).click(function () {


                    popup =  $("#someproduct").popup({
                        transition: "slideup", shadow: false, corners: false

                    }).popup("open");



                });

                $("#closePopup").click(function () {

                    popup.popup({ transition :"slidedown"},"close");

                  //  var transition = popup.popup("option", "transition");
                   // popup.popup("option", "transition", "slidedown");

                    //popup.popup({transition:"slidedown"});

                  //  
                })

弹出窗口显示为向上滑动，这很好。当我按下关闭按钮时，它不会执行向下滑动动画。有任何想法吗！

Answer 1

可在此处找到显示完整答案的相应jsFiddle： jsFiddle Sample

你会发现会有HTML示例：

<button id="MyButton">Show Popup</button>
<div data-role="popup" id="MyPopup">
    <div class="ui-content">
        Hello from my popup
        <button id="CloseButton">Close</button>
    </div>
</div>

这里的JavaScript：

jQuery("#MyButton").on("click", function () {
    jQuery("#MyPopup").popup({
        transition: "slideup"
    }).popup("open");
    jQuery("#CloseButton").on("click", function () {
        jQuery.mobile.back();
    });
});

高级别是通过使用jQuery Mobile back（）方法，将自动发生反向转换以隐藏弹出窗口。如果您使用按钮处理自己的关闭，同样也是如此。

查看jsFiddle并测试它是否适合您。

jQuery Mobile Popup Close Transition SlideDown

1 个答案: