开发者

Size menu items based on how many there are in JS

开发者 https://www.devze.com 2023-02-10 20:03 出处:网络
I need to have a menu that has items that size themselves based on how many there are. Say, ther开发者_Go百科e are three items. Each one would have about 33% width of the container. But if there were

I need to have a menu that has items that size themselves based on how many there are. Say, ther开发者_Go百科e are three items. Each one would have about 33% width of the container. But if there were were ten, each would have 10%. Does anyone have any ideas/suggestions? Thanks!


Usually menu is built from unordered list and parent menu element have id="menu" In this case you'll need code like next:

menuElt = document.getElementById('menu');
childElements = menuElt.getElementsByTagName("li");
var quantity = childElements.length;
var widthPercent = Math.round(100/quantity);
for (var i = 0; i < quantity; i++) {
  childElements[i].style.width = widthPercent + "%";
}
0

精彩评论

暂无评论...
验证码 换一张
取 消