流畅的动态创建菜单

时间:2013-06-10 06:21:32

标签: javascript jquery html css

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

 //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

1 个答案:

答案 0 :(得分:1)

<强> JS

   var percentage = 100/countMenu

OR

var percentage =countMenu/topMenuWidth*1000;

OR

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

这将根据PERCENTAGE

来修改宽度