タッチやレスポンシブ対応可能なlightboxモーダル表示のCSS記述 ※jquery.fancybox.cssファイルを読み込みます。ギャラリー画像(a[data-fancybox] img)、モーダル表示時のcaption(.fancybox__caption)のCSS記述です。必要に応じて変更して下さい。 <style> body { margin: 20px 10px; padding: 0; font-size: 14px; text-align: center; } h1{ text-align: center; font-size: 22px; line-height: 2em; padding-bottom: 20px; } a[data-fancybox] img { cursor: zoom-in; width: 150px; } .fancybox__caption
![fancybox.jsを使ってタッチやレスポンシブ対応可能なlightboxモーダル表示方法【jQueryプラグイン】|DAD UNION – エンジニア同盟](https://cdn-ak-scissors.b.st-hatena.com/image/square/e7765c9e59153a8f722f520575e0bd9579dde752/height=288;version=1;width=512/https%3A%2F%2Fdad-union.com%2Fwp-content%2Fuploads%2F2022%2F07%2Fpic20220720.jpg)