さるページ作成のために、lightgalleryというプラグインを調べた。
作成したページのうち、最単純化したのが
http://thunder3.web.fc2.com/lightgallery_simple.htmlこの例である。
本来の長いものは
http://thunder3.web.fc2.com/lightgallery.htmlだが、項目が多いだけで基本的には変わらない。
以下、参考にしたページを挙げる。
http://www.webdesignleaves.com/wp/jquery/1363/解説が詳しいが、バージョンが古いこともあり、また詳しすぎて混乱した。
https://nelog.jp/jquery-lightgalleryjsの読み込みについて、私の作った例にそのまま引用した部分がある。必要なものを読むと書いているが、とりあえず全部入れた。
また、スクリプトを読ませるのがフッター(</body>タグの直前)なのか、ヘッドの部分なのか普通に考えると、あらかじめ読ませなければいけないのだからヘッドの部分ではないかと思うが、フッタの部分に書くという人もいる。
ただ、ページが十分に読まれていないうちに写真をクリックすると、スライドショーが始まらずに単に写真が表示されるという不具合が生じる場合があるようで、原因はちょっと分からない。スクリプトを読ませる場所が関係するかどうかも、現時点では分からない。
https://www.webtoolnavi.com/lightgallery-js/作成の参考にはしなかったがなりそう。
バージョンの違いは重要である。古いバージョンのことは参考にならない場合がある。
結局のところ
https://sachinchoolur.github.io/lightgallery.js/demos/上ページ通りにやればいいのだが、jsを読む部分などは書いていない。
最単純サンプルの使用はご自由に。