Я пытаюсь интегрировать разбиение на страницы CSS в галерею миниатюр, которую я настроил на своем сайте. До сих пор я не нашел никаких руководств, указывающих на то, как настроить нумерацию страниц в существующем скрипте.
Из того, что я вижу, существует множество отличных решений для разбиения на страницы с помощью CSS. Вот страница с множеством стили разбиения на страницы (без плагинов, интеграция кажется очень общей, поэтому подойдет любая). Я скачал несколько в надежде, что учебник направит меня к тому, что я хочу, но пока не повезло.
Мой код взят из галереи изображений на чистом CSS. Я пытался интегрировать Gallerific, но инструкции показались сложными, поэтому я ищу чистый CSS-решение.
Сначала я хотел использовать несколько div для одной и той же галереи, как и Gallerific, только для того, чтобы найти JavaScript (или какое-то решение jQuery), которое потребуется для подключения ссылок, необходимых для того, чтобы галерея работала так.
В настоящее время галерея содержится в одном div (так, как это должно быть для работы). Я смотрю на добавление разбиения на страницы только на большие пальцы, например. "...<a href="#prev01"><img src="images/img/thmbs/01.jpg" alt="" class="thumb" />
..."
И вот для целей поста мой код до сих пор:
<div id="gallerycenter">
<ul id="gallery">
<li>
<a href="#prev01"><img src="images/img/thmbs/01.jpg" alt="" class="thumb" />
<span><img src="images/img/01.jpg" id="prev01" class="showcase" alt="" /></span></a>
</li>
<li>
<a href="#prev02"><img src="images/img/thmbs/02.jpg" alt="" class="thumb" />
<span><img src="images/img/02.jpg" id="prev02" class="showcase" alt="" /></span></a>
</li>
<li>
<a href="#prev03"><img src="images/img/thmbs/03.jpg" alt="" class="thumb" />
<span><img src="images/img/03.jpg" id="prev03" class="showcase" alt="" /></span></a>
</li>
<li>
<a href="#prev04"><img src="images/img/thmbs/04.jpg" alt="" class="thumb" />
<span><img src="images/img/04.jpg" id="prev04" class="showcase" alt="" /></span></a>
</li>
<li>
<a href="#prev05"><img src="images/img/thmbs/05.jpg" alt="" class="thumb" />
<span><img src="images/img/05.jpg" id="prev05" class="showcase" alt="" /></span></a>
</li>
</ul>
</div>
Единственное, о чем я подумал, но не пробовал, это изменить «.thumb» на «.pagination», чтобы начать «разбивку на страницы» в форме класса, но все же этого недостаточно, чтобы продолжать
Может ли кто-нибудь помочь мне собрать воедино все возможности или подтвердить, что я сумасшедший и слишком многого прошу от CSS?
