Как ограничить кол-во элементов, которые меняет скрипт appenChild js?

Question

[LurkingMong]

Есть такой код. Нужно как-то ограничить вывод элементов в контейнере foo, т.е. чтобы все элементы менялись в пределах 4 позиций.

Comments

[ProjectSoft]

чтобы все элементы менялись в пределах 4 позиций

4 позиции с начала или с конца? Оставшиеся элементы остаются не тронутыми или можно удалить?
В принципе, наводящими вопросами, я вас должен был подтолкнуть к решению, если вы знаете, как решают задачи на JS. )))

[LurkingMong]

ProjectSoft, 4 позиции с начала, оставшиеся элементы должны быть скрыты до того, как попадут на эти 4 позиции. К сожалению, я с js не особо хорошо работаю.

setInterval(firstToEnd, 1000);


function firstToEnd() {
	const firstElem = foo.firstElementChild;
  	foo.appendChild(firstElem);
  	foo.length = 4;
}

вот код

[ProjectSoft]

4 позиции с начала, оставшиеся элементы должны быть скрыты до того, как попадут на эти 4 позиции.

CSS в помощь. Тут не нужен JS.
foo.length = 4;Ничего не сделает. Это неправильно. Данного свойства у элемента просто нет.

Answer 1

[ragq1991]

Только у меня не прогружается фрейм в котором смотреть код нужно?
Ответ:

<ul>
<div id="foo">
  <li>You have cat to be kitten me right meow</li>
  <li>Eat plants, meow, and throw up</li>
  <li>my owner today cough furball into food bowl</li>
  <li>I shredded your linens for you</li>
 </div>
  <li>Play time carefully drink from water glass</li>
  <li>jump on human and sleep on her all night long</li>
  <li>purr in the morning and then give a bite to every human around</li>
  <li>waking up request food, purr loud scratch the walls</li>
</ul>

Comments

[ProjectSoft]

Нет. Так, наверно, у всех жителей России. Буржуи бунтуют)))
На тостере лучше выкладывать в CodePen

[ragq1991]

ProjectSoft, я житель Казахстана, нас блокировки видимо тоже цепляют. Кто-то не умеет нормально блокировки настраивать!)))

[ProjectSoft]

ragq1991 прочитайте конец пожелания.

4 позиции с начала, оставшиеся элементы должны быть скрыты до того, как попадут на эти 4 позиции.

С помощью CSS этот вопрос решается с лёгкостью для обычного правильного списка.

[LurkingMong]

ProjectSoft, в css я разбираюсь получше, но и тут додуматься не могу. Дайте подсказку пожалуйста, каким способом можно скрыть блоки, которые идут ниже 4 позиции?

[ProjectSoft]

LurkingMong

[LurkingMong]

ProjectSoft, Спасибо огромное! Все работает

[ragq1991]

ProjectSoft, признаю, неверно понял вопрос.