FC2でも使える「画像拡大JS」はこれ!jQuery不要で超軽量♩

M

2019-03-23
FC2ブログ・便利ワザ・アイテム・HTML・SEO対策など
0 COMMENTS

FC2ブロガーのMです。今回は、画像をマウスオーバーしたり、指を乗せる(スマホ表示のとき)とオーバーレイして、クリック(またはタップ)することでふわっと画像が拡大表示される画像拡大スクリプトLuminousルミナス)」について。

Webデザインのスキルが高い方のブログなどでよく見かける機能ですが、皆さんはご存知でしょうか?

画像というと、気になるのはブログが重くなること。画像表示のカスタマイズなんて聞くと、ちょっと心配になりますよねぇ…(^_^;)

でも、Luminousという画像拡大スクリプトは、jQueryが不要の超軽量jsを使っていてFC2ブログでも使えることを知りました。

で、実際に当ブログに導入してみることにしたんです。

スポンサードリンク

実装したLuminous(ルミナス)の画像拡大表示はこんな感じ

実際に、Luminousを実装してみました。画像を下に貼ってみましたよ。クリックやタップで体感してみて下さい♩

▼Luminousを実装した画像

ダニエルクレイグ

▼普通のサムネイル画像

ダニエルクレイグ

どうでしょうか?上のほうがスムーズに画像を拡大できますし、もう一度画像を押すことで簡単に戻る点も素晴らしいですよね(^^)

FC2ブログにLuminousを導入、参考になる記事をご紹介します!

さて、肝心なのは実際にFC2ブログへどのようにして実装すれば良いのか。初心者でも読めば簡単に導入できる手順を解説してる記事がありましたので、こちらを参考にすると良いと思います。

超軽量画像拡大スクリプトLuminousをFC2で使う方法

画像拡大スクリプト と言えば Lightbox(ライトボックス) や Colorbox(カラーボックス) などが有名どころですが、今回おすすめするのは Luminous(ルミナス) です。


FC2ブログで利用するための各ファイル導入の仕方、コードの書き方などのベーシックな内容に加え、速度強化用のコード記載の仕方や画像が拡大できることをわかりやすくするための追加CSSなど。
初心者向けになるべく事細かに説明したいと思います。


今回は...

初心者がつまずきやすい箇所も、ボクがコメント欄で質問してますので、それも参考にして下さい(^_^;)

不慣れなボクでも出来ましたので、興味がおありの方はぜひとも試してみてはいかがでしょうか?おすすめです(^^)

スポンサードリンク

この記事が気に入ったら
シェア!

 シェア
FC2ブログ画像拡大表示jsスクリプトLuminousルミナスjQueryブログ運営カスタマイズブロガーお役立ち
関連記事

Comments 0

There are no comments yet.

コメントする

未分類 (0)
胃がん(ブログ、闘病記録、胃癌ニュース、私の症状など胃ガン情報全般) (5826)
胃がんブログ (247)
よりぬき 胃がんブログ (16)
胃がん闘病記・日記 (5514)
胃がん手術後の食事記録 (6)
胃切除後の料理など (33)
がん治療のクラウドファンディング (10)
胃がん History (83)
ステージ3B 多発性高度リンパ節転移胃癌 (57)
胃がん再発「転移性肝がん」で余命宣告 (25)
がん のこと(ガン情報全般) (432)
がんブログ (243)
がんニュース (189)
胃がん 障害年金ブログ (71)
障害年金 - 準備編 (23)
障害年金 - 審査から年金受給まで (12)
障害年金 - 審査請求・不服申立 (26)
障害年金 - 再審査請求 (10)
Amazon (ニュース、お得なセール情報など) (129)
Amazonセール (2)
📱kindleセール (126)
今日のエッセイ (63)
ニュース・芸能・話題 (640)
恋愛・人間関係 (20)
終活ブログ (10)
グルメ (44)
胃切除後の食事・レシピ (669)
ご飯・おかゆ・和食 (174)
おかず (138)
味噌汁・スープ (73)
カレー関係 (66)
パン・洋食 (63)
麺類 (113)
その他、簡単レシピなど (39)
ブログ (217)
FC2ブログ・便利ワザ・アイテム・HTML・SEO対策など (182)
Google Adsense (アドセンス) (8)
趣味や将棋のこと (26)
ファッション (1)
司法書士 (26)
仕事・実務や登記のこと (1)
事件ファイル (25)
COLLECTION (28)
家電 (13)
ホーム&キッチン (4)
ビューティー&ケア (4)
QOLの改善&ヘルスケア (2)
お酒 (5)