Making a Toolbar

2 posts, 1 answers
  1. mvbaffa
    mvbaffa avatar
    102 posts
    Member since:
    Dec 2006

    Posted 25 Oct 2011 Link to this post

    Hi,

    I would like to include in my application toolbar buttons.

    Is there a way, using your k-classes, to construct a typical toolbar with image buttons and push down and up effects ???

    Thanks in advance
  2. Answer
    Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 26 Oct 2011 Link to this post

    Hello Marcus,

    You can use a Menu widget with template items:

    http://demos.kendoui.com/menu/index.html

    Push down and up effects (toggle state) are not supported for elements with the k-button CSS class, so you will need to implement those with your own Javascript. You can use the k-state-hover and k-state-selected, for example:


    <ul id="menu" class="k-widget k-reset k-header k-menu k-menu-horizontal">
         <li class="k-item k-state-default k-first">
              <div class="k-link">
                   <button class="k-button">button 1</button>
              </div>
         </li>
         <li class="k-item k-state-default k-last">
              <div class="k-link">
                   <button class="k-button k-state-hover">button 2</button>
              </div>
         </li>
         <li class="k-item k-state-default k-last">
              <div class="k-link">
                   <button class="k-button k-state-selected">button 2</button>
              </div>
         </li>
    </ul>



    Regards,
    Dimo
    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
Back to Top