2012-08-03 86 views
0

我正在尝试将CS​​S分页集成到我在网站上设置的缩略图库中。到目前为止,我还没有找到任何教程指出如何将分页自定义到现有脚本中。如何将分页添加到我的网站的画廊?

从我看到的那里,有很多很棒的CSS分页解决方案。这里的a page有很多分页样式(没有插件,整合似乎是非常一般的,所以任何会做)。我已经下载了一些,希望一个教程能够引导我达到我想要的目标,但目前为止还没有运气。

我的代码取自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?

回答

0

您误解了您发布的链接。它提供款式只有,没有功能,因为CSS没有提供这个功能。分页不是向页面添加样式的问题,可以通过编程方式实现,无论是服务器端还是客户端JavaScript。你应该选择一个现有的jQuery分页插件并使用它,你不会找到一个只使用CSS来提供分页的解决方案,因为这基本上不是CSS的用处。

+0

这似乎是我误解了很多在过去几天我所做的搜索结果搜索。在这种情况下,可以将分页应用于我试图在上面实现的概念。我不需要它完全是CSS。本来不错。 – 2012-08-06 11:10:13

+0

gallerific充分的工作。我不明白如何实现这些代码,因为在tut中没有真正的参考,这只会让我看到巩固代码的有趣问题。感谢我的男士回复。 – 2012-10-11 13:34:01