jQWidgets Forums

jQuery UI Widgets › Forums › Layouts › Splitter › Need to avoid scroller in Splitter

Tagged: 

This topic contains 2 replies, has 2 voices, and was last updated by  Peter Stoev 11 years, 9 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Need to avoid scroller in Splitter Posts
  • August 14, 2013 at 10:24 am Need to avoid scroller in Splitter #26797

    mullai.b
    Participant
    August 14, 2013 at 10:27 am Need to avoid scroller in Splitter #26799

    mullai.b
    Participant

    Hi All,

    I get vertical and horizontal scroll bar when defining splitter in %. How can i avoid it

    <!DOCTYPE html>
    <html lang='en'>
    <head>
    <meta name='keywords' content='jqxDocking, jQuery Docking, jQWidgets, Default Functionality' />
    <meta name='description' content='jqxDocking' />
    <title id='Description'>jqxDocking represents a widget which enables you to manage and
    layout multiple windows on a web page.</title>
    <link rel='stylesheet' href='../../jqwidgets/styles/jqx.base.css' type='text/css' />
    <script type='text/javascript' src='../../scripts/jquery-1.9.1.min.js'></script>
    <script type='text/javascript' src='../../scripts/gettheme.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxcore.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxwindow.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxdatetimeinput.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxcalendar.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxtooltip.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxtabs.js'></script>
    <script type='text/javascript' src='../../jqwidgets/globalization/globalize.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxdocking.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxlistbox.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxscrollbar.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxbuttons.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxpanel.js'></script>
    <script type='text/javascript' src='../../jqwidgets/jqxsplitter.js'></script>
    <script type="text/javascript">
    $(document).ready(function () {
    var theme = '';
    $('#mainSplitter').jqxSplitter({ width: '100%', height: '100%', theme: theme, orientation: 'vertical', panels: [{ size: '10%' }, { size: '90%'}] });
    });
    </script>
    <style type="text/css">
    html, body
    {
    height: 100%;
    width: 100%;
    margin:0;
    padding:0;
    }
    #splitterContainer
    {
    height: 100%;
    width: 100%;
    }
    </style>
    </head>
    <body class='default'>
    <div id="splitterContainer">
    <div id="mainSplitter">
    <div class="splitter-panel">
    Panel 1</div>
    <div class="splitter-panel">
    Panel 2</div>
    </div>
    </div>
    </body>
    </html>

    With Regards,
    Mullai Malar

    August 15, 2013 at 4:40 am Need to avoid scroller in Splitter #26860

    Peter Stoev
    Keymaster

    Hi mullai.b,

    You missed the overflow: hidden setting.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.