弹出窗口定位按钮

时间:2013-10-08 22:43:31

标签: javascript jquery html jquery-mobile

我的屏幕右下角有一个用jQuery Mobile制作的不可点击的按钮。我试图让我的弹出窗口显示在此按钮的顶部或上方和左侧。

目前我正在尝试测试jQuery mobile的定位功能窗口,原点或#myelement。然而,我选择哪个选项,弹出窗口总是弹出窗口中间。我不确定我做错了什么,因为我相信我正确地遵循这些例子。

这是我的代码:

<div class="StatusButtons">
<a href="#CS_popup" data-rel="popup" data-position-to="origin" data-icon="GhCsStatus-Red" data-inline="true" data-mini="true" data-role="button" id="GhCsStatus_CS" style="display: none; pointer-events: none;">CS</a>
<a href="#GH_popup" data-rel="popup" data-position-to="origin" data-icon="GhCsStatus-Red" data-inline="true" data-mini="true" data-role="button" id="GhCsStatus_GH" style="display: none; pointer-events: none;">GH</a>
</div>  

<div id="GH_popup" data-role="popup" >
    <p> GH is OFF! </p>
</div>

<div id="CS_popup" data-role="popup" >
    <p> CS is OFF! </p>
</div>


<script type="text/javascript" >
    $(document).ready(function () { GrabGhCsStatus(); });

    var CScount = 0;
    var GHcount = 0;
    var GHCScount = 0;

    function GrabGhCsStatus() {
        var url = '@Html.Raw(Url.Action("index","GhCsStatus"))';
        $.get(url, function (data) {
            if (data.CheckIfCsIsRunning == 1) {
                $('#GhCsStatus_CS').show();
                if (data.CsStatus == 0) {
                    $('#GhCsStatus_CS').buttonMarkup({ icon: 'GhCsStatus-Red' });
                    if (CScount == 0) {
                        $('#CS_popup').popup("open");
                        CScount = 1;
                    }
                }
                else {
                    $('#GhCsStatus_CS').buttonMarkup({ icon: 'GhCsStatus-Green' });
                    CScount = 0;
                    //alert("CS:1/green");
                }
            }
            else {
                $("#GhCsStatus_CS").remove();
            }

            if (data.CheckIfGhIsRunning == 1) {
                $('#GhCsStatus_GH').show();
                if (data.GhStatus == 0) {
                    $('#GhCsStatus_GH').buttonMarkup({ icon: 'GhCsStatus-Red' });
                    if (GHcount == 0) {
                        $("#GH_popup").popup("open");
                        GHcount = 1;
                    }
                }
                else {
                    $('#GhCsStatus_GH').buttonMarkup({ icon: 'GhCsStatus-Green' });
                    GHcount = 0;
                }
            }
            else {
                $("#GhCsStatus_GH").remove();
            }
            // Set timeout, if CS or GH is enabled.
            if (data.CheckIfCsIsRunning == 1 || data.CheckIfGhIsRunning == 1) {
                window.setTimeout(GrabGhCsStatus, 5000); //120000); // 2 minutes
            }
        }, "json");
    }
</script>

这是我的项目代码的一个jsfiddle:

http://jsfiddle.net/liondancer/nC2dm/1/

我似乎无法在jsFiddle中重新创建错误。此错误仅发生在我的代码中。我尝试简化jsfiddle中的代码,但它似乎正常工作。但是,在我的项目中,它无法正常工作。

如果还有其他需要,请随时提出更多要求!谢谢

0 个答案:

没有答案