jQuery UI Widgets Forums Layouts Splitter Splitter divider jumps around on iPad

This topic contains 1 reply, has 2 voices, and was last updated by  Peter Stoev 12 years, 1 month ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author

  • arudmik
    Member

    We are evaluating jqwidget library as a way of developing HTML5 apps that also work in the iPad. We have nested the Splitter within a Tab. Adjusting the splitter in a desktop browser works fine. On the iPad the splitter jumps back and forth as one drags the splitter. I can provide the URL for testing this. The same splitter panels works fine without the parent tabs.

    • This topic was modified 12 years, 1 month ago by  arudmik.

    Peter Stoev
    Keymaster

    Hi arudmik,

    I am unable to reproduce the issue locally. I nested a Splitter within a Tab and tested the application with IPAD.

    Here’s my test application:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxsplitter.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxtabs.js"></script>
    <script type="text/javascript">
    $(document).ready(function () {
    $('#splitter').jqxSplitter({ height: 600, width: '100%', panels: [{ size: 200 }, { size: 400}] });
    $("#tabs").jqxTabs({ width: '80%' });
    });
    </script>
    </head>
    <body class='default'>
    <div style="width: 100%; height: 1000px;">
    <div style="float:left; width: 10%; height:100%;">
    </div>
    <div style="float:left;" id="tabs">
    <ul>
    <li style="margin-left: 30px;">Tab 1</li>
    <li>Tab 2</li>
    </ul>
    <div id="splitter">
    <div class="splitter-panel">
    Content 1.1
    </div>
    <div class="splitter-panel">
    Content 1.2
    </div>
    </div>
    <div>
    Content 2
    </div>
    </div>
    </div>
    </body>
    </html>

    The Splitter’s dragging works fine. I guess that there’s something(css settings, html element, another widget or some other issue) that can break the default behavior in your app. Could you send us a small sample with jQWidgets – JavaScript + HTML code that I can copy locally and debug the specific application scenario?

    Best Regardsm
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.