簡単設置の画像クリックでポップアップ表示するデザインJS

Javascriptで写真（画像）を表示しクリック時に拡大表示する～ mamimageviewer.js

■使い方

上記ボタンを押してmamimageviewer.jsをダウンロードします。
mamImageViewerを使いたいファイルで、
```
  <script src="./js/mamimageviewer.js"></script>
```
のように、相対又は絶対パスでmamimageviewer.jsを指定します。

以下の構造で親divにclass="mamImageViewer"を指定します。

<div class="mamImageViewer">
  <div>
    <img src="./imgs/car1.jpg" alt="黄色い車" title="黄色い色のスポーツカー">
  </div>
  <div>
    <img src="./imgs/car2.jpg" alt="赤い車" title="赤いRV">
  </div>
  <div>
    <img src="./imgs/car3.jpg" alt="銀色の車" title="シルバーのセダン">
  </div>
</div>

■使用例

画像をクリックしてください

■使用例２

画像をクリックしてください

<div class="mamImageViewer">
  <div>
    <img src="./imgs/c001.jpg" alt="室内１" title="補足説明１">
  </div>
  <div>
    <img src="./imgs/c002.jpg" alt="室内２" title="">
  </div>
  <div>
    <img src="./imgs/c003.jpg" alt="室内３" title="補足説明">
  </div>
  <div>
    <img src="./imgs/c004.jpg" alt="室内４" title="">
  </div>
  <div>
    <img src="./imgs/c005.jpg" alt="室内５" title="補足説明５です">
  </div>
  <div>
    <img src="./imgs/c006.jpg" alt="室内６" title="">
  </div>
  <div>
    <img src="./imgs/c007.jpg" alt="室内７" title="補足説明をここに入れます">
  </div>
</div>