intense.jsを活用した画像拡大・スクロール表示の実践ガイド｜DAD UNION – エンジニア同盟intense.jsは、クリックした画像をビューアとして拡大表示するための非常にシンプルで効果的なJavaScriptライブラリです。 この記事では、intense.jsを使用して画像を拡大表示し、拡大画像を上下左右にスクロール表示する方法を解説します。 前提となるCSSの設定 まずは、拡大表示する画像のサムネイルエリアを定義するためのCSSを設定します。このサムネイルエリアは .demo クラスとして定義されます。 このエリアは、マウスカーソルを上に乗せると拡大マークが表示され、クリックすることで画像が拡大されるようになっています。 <style> * { padding: 0; margin: 0; } body { font-size: 14px; text-align: center; } .ttl{ text-align: center; font-size: 20px; pad
