画像や動画をポップアップで表示させるJavaScriptのプラグインで、特に有名なものでは[LightBox]が挙げられます。 ここで紹介する[Lity]は[LightBox]と同じように使えるjQueryプラグインで、レスポンシブにも対応済み。またデータ容量も4KB未満と軽量で気軽に導入できる点が魅力です。 その実装方法ですが、まずは公式配布サイトより必要なファイルをダウンロードしてきましょう。 [Lity]:公式サイト いくつかのファイルが梱包されていますが、このうち使うのは「lity.min.css」と「lity.min.js」の2つのファイル。 当然ですが[Lity]はjQueryに依存していますので、jQuery本体のスクリプトも必要です。 lity.min.css lity.min.js jquery.js これらのファイルをHTMLの <head>~</head> 内で読み込
![【jQuery】画像、動画、ボックス要素をポップアップで表示させる[Lity]の使い方。](https://cdn-ak-scissors.b.st-hatena.com/image/square/619ea591ff08f5018e9705d3d2b2772600509cc6/height=288;version=1;width=512/https%3A%2F%2Fon-ze.com%2Fwordpress%2Fwp-content%2Fthemes%2Fonze-2022%2Finc%2Fthumbnail%2F600x360x80-9ba6cca3e6aff99506726b2a7bd0d9af-thumbnail.png)