我正在尝试将 CSS 分页集成到我在我的网站上设置的缩略图库中。到目前为止,我还没有找到任何指向如何将分页自定义到现有脚本的教程。
据我所知,有很多很棒的 CSS 分页解决方案。这是一个有很多分页样式的页面(没有插件,集成似乎很通用,所以任何人都可以)。我下载了一些,希望教程能指导我找到我想要的东西,但到目前为止还没有运气。
我的代码取自Pure CSS image gallery。我看了一下集成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 的要求太多了吗?