Показать сообщение отдельно
  #6 (permalink)  
Старый 04.07.2018, 12:42
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

Симуляция нескольких страниц
<button id="up">⇑</button>
<button id="down">⇓</button>
<div class="page">
   <div class="section">Один</div>
   <div class="section" style="display:none;">Два</div>
   <div class="section" style="display:none;">Три</div>
   <div class="section" style="display:none;">Четыре</div>
</div>
<div class="page">
   <div class="section" style="display:none;">Пять</div>
   <div class="section" style="display:none;">Шесть</div>
   <div class="section" style="display:none;">Семь</div>
</div>
<script>
   var pages = document.querySelectorAll('.page'),
         divs = pages[0].querySelectorAll('div'),
         i = 0, j = 0;
   down.onclick = function() {
        divs[i].style.display="none";
        i = (i < (divs.length - 1))?i+1:0;
        if(i == 0) {    // здесь как-бы загрузка предыдущей страницы
            j = (j > 0)?j -1:pages.length - 1;
            divs = pages[j].querySelectorAll('div')
        }
        divs[i].style.display="block";
   }
   up.onclick = function() {
        divs[i].style.display="none";
        i = (i > 0)?i -1:divs.length - 1;
        if(i == divs.length - 1) { // здесь как-бы загрузка следующей страницы
            j = (j < (pages.length - 1))?j+1:0;
            divs = pages[j].querySelectorAll('div');
            i = divs.length - 1;
        }
        divs[i].style.display="block";
   }

</script>
Ответить с цитированием