Lightboxが動かない場合はこれを試して
久々にLightboxを使おうとしたら、何故か動かなくてはまってしまったので、メモしておきます。
1）Lightbox本家サイトからスクリプトをダウンロードしてくる
http://lokeshdhakar.com/projects/lightbox2/
2）下記の3つのファイルをアップロードする
js/lightbox.min.js
css/lightbox.css
images/close.png
images/loading.png
images/next.png
images/prev.png
3）<head>内に以下を記述
<link rel=”stylesheet” href=”css/lightbox.css”>
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js”></script>
4）</body>の直前に以下を入れる
<script src=”js/lightbox.min.js”></script>
何故か動かなくて、検索したら、2015年6月以前に書かれたものである場合には、説明通りに記述してもうまく動かないそうで、上記が違っていました。今は<head>内に入れないようです。
aタグにrel=”lightbox”と入れるという方法が紹介されていましたが、こちらは古いみたいです。
5）ソースサンプル
- 前の記事
- （WEB制作入門6）ショッピングカートのいろいろ
- 次の記事
- 千畳敷カールで2612体験してきました
関連記事
-
-
【Q】ホームページのバックアップってどうすればいいですか？
バックアップについてお話する前に、ホームページには２種類あることを復習しますね。 １つは静的に作られ… ≫続きを読む
-
-
パラコードアクセサリー製作入門！ in 駒ヶ根高原・ヴァンドール
突然ですが、パラコードって知ってますか。 パラシュートを結ぶ紐なんですが、弾力があって柔らかいのに、… ≫続きを読む
-
-
【保存版】AIって何？まずはここから！ChatGPT / Midjourneyを初心者向けに徹底解説
最近AIの話題ばかり…敬遠していた分野だけど、ちょっとどんなものか知っておいたほうがいい… ≫続きを読む
-
-
WordPressの2段階認証が失敗する場合
WordPressのセキュリティを上げるために、2段階認証を導入しましたが、 よくご質問を受ける失敗… ≫続きを読む
-
-
長野ADC主催のデザイン会議
昨日は長野ADC主催のデザイン会議に出てきました。会場が素敵で、古い酒蔵をくつろぎスペースに改造・再… ≫続きを読む
-
-
【Q】SEO対策しませんか？という電話がありました。どこで調べたのか私の個人情報も結構知っていて不安です。
●●グループから電話がかかってきましたか？ しつこい営業でけっこう悪名高いところなので無視していただ… ≫続きを読む
-
-
時間の計算をしたい時に・・・
ちょっとしたメモです。 数字が弱いわたしは、13時35分から1時間半で・・・と言われてもすぐに 何時… ≫続きを読む
-
-
TinyMCEにスタイルを追加する
自分への備忘録なので丁寧な記事ではなくてすみません。 function.phpに下記を追加 /** … ≫続きを読む
-
-
【ホームページの作り方】地域密着型のお店のホームページ作成
どの町にもある小さなお店、地域のお店…ふとん屋さん、本屋さん、ケーキ屋さん、中古車販売店。 ネットで… ≫続きを読む
-
-
HTMLコードの編集がよくわからない…不安という方に
こんにちはモンガです。今日はHTML コードが簡単に編集できる便利なツールの 紹介をします。 ネット… ≫続きを読む