jQuery счетчик количества

19 марта 2016

Иногда встречается что нужно высчитывать количество блоков или списка и уже в зависимости от количества выполнять ту или иную задачу. Например, есть задача сделать респонсив меню на всю ширину, при этом динамически устанавливать ширину ссылок, если вдруг в меню добавится или уберется пункт меню, то как установить ширину ссылки автоматом? Использовать так:

 

var $this = $('nav li');
if ($this.length == 1) {
  $this.addClass('one');
} else if ($this.length == 2) {
  $this.addClass('two');
} else if ($this.length == 3) {
  $this.addClass('three');
} else if ($this.length == 4) {
  $this.addClass('four');
} else if ($this.length == 5) {
  $this.addClass('five');
} else if ($this.length == 6) {
  $this.addClass('six');
} else if ($this.length == 7) {
  $this.addClass('seven');
} else if ($this.length == 8) {
  $this.addClass('eight');
} else if ($this.length == 9) {
  $this.addClass('nine');
} else if ($this.length == 10) {
  $this.addClass('ten');
}

В CSS:

nav li.one {width: 100%;}
nav li.two {width: 50%;}
nav li.three {width: 33.33%;}
nav li.four {width: 25%;}
nav li.five {width: 20%;}
nav li.six {width: 16.4%;}
nav li.seven {width: 14%;}
nav li.eight {width: 12.5%;}
nav li.nine {width: 11%;}
nav li.ten {width: 10%;}