JQuery中的等间距导航链接无序列表问题
我正在编写一个JQuery脚本,它使用右边距在一个包含JQuery中的等间距导航链接无序列表问题,jquery,navigation,width,hyperlink,Jquery,Navigation,Width,Hyperlink,我正在编写一个JQuery脚本,它使用右边距在一个包含的页面中均匀地分布可变大小的水平导航链接。算法是: 答:获取容器的宽度 B:将容器内所有项目的宽度相加 C:通过从A中减去B,再除以容器中项目的数量,减去1,计算每个项目的右边距(最后一个) 但我的算法或代码中都存在缺陷,因为链接溢出了容器。这是我的密码。你能帮忙吗 谢谢, -诺斯克 HTML看起来像: <nav id="main-nav"> <ul> <li> <a href="#">home
的页面中均匀地分布可变大小的水平导航链接。算法是:
答:获取容器的宽度
B:将容器内所有
项目的宽度相加
C:通过从A中减去B,再除以容器中项目的数量,减去1,计算每个项目的右边距(最后一个)
但我的算法或代码中都存在缺陷,因为链接溢出了容器。这是我的密码。你能帮忙吗
谢谢,
-诺斯克
HTML看起来像:
<nav id="main-nav">
<ul>
<li>
<a href="#">home</a>
</li>
<li>
<a href="#">link-number-2</a>
</li>
</ul>
</nav>
-
-
你应该除以LIs的数量,而不是LIs-1的数量。我只是假设了一些css规则,但我相信这就是你想要的。
我不想这么说,但对我来说很好。对于它(我假设最小CSS)。代码的顶部是您的代码(有效),底部注释掉的部分是我的版本(它没有添加任何内容,但效率更高)。您能告诉我们css是什么样子吗?呃,不。LIs之间的间距比LIs的间距少一个。您说得对,我的错。问题是LI的宽度不同,简单的划分不起作用,因为一个LI(特别是最后一个)可以大得多。感谢Armin,非常聪明地使用:not.All,这是CSS问题,而不是我的脚本问题。我对我的列表项使用display:inline块,当我将其更改为display:block和float:left时,它起作用了。嗯,是的。正如@boyetboy也提到的,JS看起来工作得很好,只是一些css调整。上面这句话只是一个建议:)谢谢你。在你的帮助和Armin的帮助下,我发现这是一个CSS问题,而不是我的脚本问题。
<nav id="main-nav">
<ul>
<li>
<a href="#">home</a>
</li>
<li>
<a href="#">link-number-2</a>
</li>
</ul>
</nav>
$('#main-nav ul li:not(:last-child)').css('margin-right', linkSpacing + "px");