JQuery在无序列表问题中等距离导航链接

我正在编写一个JQuery脚本，它使用margin-right在包含

内部均匀地分隔可变大小的水平导航链接。 算法是：

答：获取

容器的宽度。

B：添加容器内所有

• 项的宽度。

  C：通过从A中减去B并除以容器中

• 项目的数量减1来计算除最后
• 之外的每个项目的右边距。

  但是在我的算法或代码中存在缺陷，因为链接溢出容器。 这是我的代码。 你能帮帮忙吗？

  谢谢，-Northk

    var containerWidth = $('#main-nav ul').width(); var linksWidth = 0; $('#main-nav ul').children().each(function() { linksWidth += $(this).width(); }); var linkSpacing = Math.floor((containerWidth - linksWidth) / ($('#main-nav ul').children().length - 1)); $('#main-nav ul').children().css('margin-right', linkSpacing + "px"); $('#main-nav ul').children().filter(":last").css('margin-right', 0); 

  HTML看起来像：

   
   
   
   home 
   
   link-number-2 
   
    

  Answer 1

  我只是假设了一些css规则，但我相信这就是你要找的东西。 http://jsfiddle.net/TEDhb/

   $('#main-nav ul li:not(:last-child)').css('margin-right', linkSpacing + "px"); 

  Answer 2

  讨厌这样说，但它对我来说很好。 这是jsFiddle （我假设最小的CSS）。 代码的顶部是你的代码（可以工作），底部注释掉的部分是我的版本（除了更有效之外什么都不添加）。

  Answer 3

  您应该除以LI的数量，而不是LIs-1的数量。