画像の見せ方

A-1. サムネイル(クリック拡大 /ブラウザ内)

  • 元のページの上に画像が拡大し、浮き上がらせる(元のページは、背景として暗くなる)
  • 拡大した画像の中で左右に画像を「次へ」「前へ」推移

EXAMPLE / 動作サンプル

A-2. サムネイル(クリック拡大 /ブラウザ内orスクリーン全体)

  • ブラウザ全体に黒背景色が入り、画像を表示
  • 拡大した画像の中で左右に画像を「次へ」「前へ」推移
  • 四方面鉤括弧アイコン(右上)をクリックでスクリーン全体に画像を広げる

EXAMPLE / 動作サンプル

B. スライドショー (サイズ固定/ブラウザの中央配置)

  • 矢印、画像下のドットで画像をスライド
  • サムネイルがないため、特定の画像をすぐに閲覧したい場合には不向き

EXAMPLE / 動作サンプル

C. スライドショー (ブラウザ横幅いっぱい)

  • 矢印、画像下のドットで画像をスライド
  • サムネイルがないため、特定の画像をすぐに閲覧したい場合には不向き
  • 画質を考慮し、大きい画像を用意しないとならず、また縦画像が扱いにくい

EXAMPLE / 動作サンプル

D. スライドショー (ブラウザ横幅いっぱい/前後の画像をチラ見せ)

  • 矢印、画像下のドットで画像をスライド
  • サムネイルがないため、特定の画像をすぐに閲覧したい場合には不向き
  • 画質を考慮し、大きい画像を用意しないとならず、また縦画像が扱いにくい

EXAMPLE / 動作サンプル