自分のサイトに設定したサムネイル ギャラリーに CSS ページネーションを統合しようとしています。これまでのところ、ページネーションを既存のスクリプトにカスタマイズする方法を示すチュートリアルは見つかりませんでした。
私が見た限りでは、優れた CSS ページネーション ソリューションがたくさんあります。これは、多くのページネーション スタイルを含むページです (プラグインはありません。統合は非常に一般的であるように思われるため、何でも構いません)。チュートリアルが私が望むものに私を導くことを期待して、私はいくつかをダウンロードしましたが、今のところ運がありません.
私のコードはPure CSS image galleryから取得されました。Gallerificの統合を検討しましたが、説明が難しいため、純粋な CSS ソリューションを探しています。
最初は、Gallerific のように、同じギャラリーに複数の div を使用したかったのですが、ギャラリーがそのように機能するために必要なリンクを接続するために JavaScript (またはある種の jQuery ソリューション) が必要になるだけでした。
現在、ギャラリーは 1 つの 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 に頼りすぎていることを確認したりできる人はいますか?