jQWidgets Forums

Forum Replies Created

Viewing 1 post (of 1 total)
  • Author
    Posts
  • February 15, 2013 at 4:28 pm in reply to: ToolTip in Modal jqxWindow ToolTip in Modal jqxWindow #15315

    bpsilver
    Member

    Peter,

    I’ve tried to set the z-order as high as 99999, but it still shows underneath the modal window. I can reproduce this on jqWidgets 2.6 & 2.7. Here’s a simple test page:

    <!DOCTYPE html>
    <html>
    <head>
        <title>ToolTip Tester</title>
        <link href="/jqwidgets/styles/jqx.base.css" rel="stylesheet" type="text/css" />
        <link href="/jqwidgets/styles/jqx.classic.css" rel="stylesheet" type="text/css" />
        <script src="/Scripts/jquery-1.8.2.min.js" type="text/javascript"></script>
        <script src="/jqwidgets/jqxcore.js" type="text/javascript"></script>
        <script type="text/javascript" src="/jqwidgets/jqx-all.js"></script>
        <script type="text/javascript" src="/jqwidgets/globalization/jquery.global.js"></script>
        <script>
            $(function () {
                var $popup;
                $('#testlink').click(function (e) {
                    e.preventDefault();
                    if (!$popup) {
                        $popup = $('#popup').jqxWindow({ width: 300, height: 250, theme: 'classic', isModal: true });
                    } else {
                        $popup.jqxWindow('open');
                    }
                    var $tt = $('#popupcontent').jqxTooltip({ content: "test tooltip", position: 'top', autoHide: false });
                    $tt.css("z-index", 25000);
            });
        </script>
    </head>
    <body>
    <h2>tooltip.cshtml</h2>
    <p>
    <a id='testlink' href="#">Test Link</a>
    </p>
    <div id="popup" style="">
        <div>Header</div>
        <div id="popupcontent" style="height: 30px; margin-top: 60px; border: 1px solid green"><p>here is some content in the modal</p></div>
    </div>
    </body>
    </html>
  • Author
    Posts
Viewing 1 post (of 1 total)