javascript - 流体中动态创建的菜单

Question

我有一个创建动态菜单的任务。为此我使用了下面的代码

 //For Menu Count
    var countMenu = $('#topMenu ul li').length;
    var topMenuWidth = $('#topMenu').width(); 
    var percentage = topMenuWidth / countMenu;
    $('#topMenu ul li').css('width', percentage);
    $('#adminChild .columnDiv').css('width', percentage);

但它适用于像素宽度 mmenus。我想让菜单响应。当我这样做时，它不会采用实际宽度。CSS 是

#topMenu
{
    float: left;
    height: 51px;
    width:97%;
}
#topMenu ul
{
    width: 100%;
    margin: 0;
    padding: 0;
}

在输出中我可以看到这样

<li id="1" style="width: 109.143px;">

也错过了最后一个菜单。我该如何解决这个问题..有没有其他方法可以动态创建菜单？ DEMO

Answer 1

JS

   var percentage = 100/countMenu

或

var percentage =countMenu/topMenuWidth*1000;

或

  var widthPerElement = topMenuWidth/countMenu
  var percentage = widthPerElement/topMenuWidth *100

这将根据 PERCENTAGE 转换宽度