Using a splitter on only selected div tags

3 posts, 1 answers
  1. Shane P
    Shane P avatar
    86 posts
    Member since:
    Sep 2012

    Posted 07 Feb 2012 Link to this post

    I have some html that I have applied the splitter to.

    <div class="frame">
    <div class="left-nav"></div>
    <div class="content"></div>
    <div class="clear"></div>
    </div>

    My class left-nav has a set width of 200px and my content class doesn't have a set width.
    clear just removes the floating.

    Can the splitter be applied just to left-nav?

    I have tried

    $(".frame").kendoSplitter({
              panes: [
                              { collapsible: true,size:"200px",max:"200px"},
                          {},{}
                                
        
                          ]
          });

    But it applies a panel to the .content div.

    Any suggestions?
  2. Answer
    Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 08 Feb 2012 Link to this post

    Hello Shane,

    The layout and structure of a splitter is defined within the DOM as a DIV with child elements.
    There is no need to manually clear the floating - KendoUI will do that for you. Please check the following example:
    <p>Content before</p>
    <div class="frame">
        <div class="left-nav"></div>
        <div class="content"></div>
    </div>
    <p>Content after</p>
     
    <script>
        $(document).ready(function(){
            $(".frame").kendoSplitter({
                panes: [
                    { collapsible: true, size:"200px", max:"200px"},
                    {}
                ]
            });
        });
    </script>


    Greetings,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Shane P
    Shane P avatar
    86 posts
    Member since:
    Sep 2012

    Posted 08 Feb 2012 Link to this post

    Thanks Alexander. I was using clear to format the layout of my page.

    With a little rework all is good.

    Thank you
Back to Top