EasyUI Forum
July 17, 2024, 04:05:27 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Menu: feature request  (Read 16701 times)
anton.dutov
Newbie
*
Posts: 27


View Profile
« on: September 12, 2012, 07:53:30 AM »

Current version requires set width for menu? can you add autosize calculation?
Please reffer idea
http://jsfiddle.net/2rVwN/2/
http://jsfiddle.net/2rVwN/3/
Logged
anton.dutov
Newbie
*
Posts: 27


View Profile
« Reply #1 on: September 14, 2012, 07:06:25 AM »

Please review  rewritten menu plug-in.

Rewrited piece
Code:
    function wrapMenu(menu) {
      // Tmp is element for text width calculation
      var tmp = $('<div/>').addClass('menu').css({
        visibility:'hidden'
        }).appendTo('body');
      // Tmp variable contains maximum item width
      var autoWidth = 0;
      menu.addClass('menu').find('>div').each(function() {
        var item = $(this);
        if (item.hasClass('menu-sep')) {
          item.html('&nbsp;');
        } else {
          // the menu item options
          var itemOpts = $.extend({}, $.parser.parseOptions(this, ['name', 'iconCls', 'href']), {
            disabled: (item.attr('disabled') ? true : undefined)
          });
          item.attr('name', itemOpts.name || '').attr('href', itemOpts.href || '');
          var text = item.addClass('menu-item').html();
  // Fill tmp
          tmp.html(text);
  // Get width + left offset + arrow width
          var itemWidth = tmp.width() + 28 + 22; // + Left offset + arrow width
  // If width greater than previous, replace width
          if (autoWidth < itemWidth) {
            autoWidth = itemWidth;
          }

          item.empty().append($('<div class="menu-text"></div>').html(text));
          if (itemOpts.iconCls) {
            $('<div class="menu-icon"></div>').addClass(itemOpts.iconCls).appendTo(item);
          }
          if (itemOpts.disabled) {
            setDisabled(target, item[0], true);
          }
          if (item[0].submenu) {
            $('<div class="menu-rightarrow"></div>').appendTo(item); // has sub menu
          }
          item._outerHeight(22);
        }
      // Remove tmp element
      tmp.remove();
      // Apply autowidth
      menu.css({width:autoWidth});
      menu.hide();
    }
  }
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!