All About オールアバウト
デジタル
  • パソコン・周辺機器
  • カメラ・AV機器
  • 携帯電話・スマートフォン
  • IT・インターネット
  1. All About
  2. デジタル
  3. IT・インターネット
  4. ホームページ作成
  5. 画像の表示・活用 (HTML,CSS,JavaScript)
  6. 別窓を開かずにその場クリックで拡大画像を表示する4つの方法
この写真の記事へ

別窓を開かずにその場クリックで拡大画像を表示する4つの方法(画像)(5ページ目)

更新日:2022年12月11日
西村 文宏

執筆者:西村 文宏

ホームページ作成ガイド

画像クリックでその場に拡大画像を表示できる定番スクリプトLightbox2

画像クリックでその場に拡大画像を表示できる定番スクリプトLightbox2

この写真の記事へ
Lightbox Plusで、別窓を開かずに、その場で拡大画像を表示!
その場で拡大画像を表示できる定番スクリプトLightbox2
拡大画像だけでなく別ページの内容すらもオーバーレイ表示できるColorbox
ブラウザのウインドウ(画面)全体を最大限に使って拡大画像を表示できるIntense Images
画像クリックでその場に拡大画像を表示できる定番スクリプトLightbox2
ブラウザのウインドウ(画面)全体を最大限に使って拡大画像を表示できるIntense Images
画像クリックによる拡大画像だけでなく別ページの内容すらもオーバーレイ表示できるColorbox
jQuery不要で、古いブラウザでも動作するLightbox Plus

ほかのギャラリーを見る

ハートマークも文字として定義されているので、色やサイズはCSSで自由に装飾できる (Edgeでの表示例)
EdgeではWebkit用の記述も有効になっている例
一度無効化されたボタンでも、再度有効な状態に戻せるようにする
よく使われるサンプル用ドメイン名のスペルミスを狙った危険なウェブサイトもある
アクセスするたびに異なる画像が表示される
ページ移動や別ウインドウを表示することなく、任意のメッセージや別ページの内容を表示できる

人気記事ランキング

  • 1
    【HTML+CSS】ウインドウ幅に合わせて画像サイズを変化させる方法
    【HTML+CSS】ウインドウ幅に合わせて画像サイズを変化させる方法
    2021/12/22
  • 2
    ドロップダウンメニューとは?HTML+CSSだけで簡単に作る方法
    ドロップダウンメニューとは?HTML+CSSだけで簡単に作る方法
    2022/07/28
  • 3
    短縮URLの作り方おすすめ3選!Googleの"goo.gl"は終了
    短縮URLの作り方おすすめ3選!Googleの"goo.gl"は終了
    2022/09/01
  • 4
    idとclassの違いと使い分け!スタイルシート(CSS)適用法
    idとclassの違いと使い分け!スタイルシート(CSS)適用法
    2022/07/19
  • 5
    丸囲み数字などの環境依存文字を使う方法
    丸囲み数字などの環境依存文字を使う方法
    2019/07/30
ランキングをもっと見る

ホームページ作成

  • ホームページ作成の基本
  • ホームページ作成ソフトの選び方
  • HTML5とは
  • CSS3とは
  • HTML・スタイルシート(CSS)の基礎
他のテーマも見る

カテゴリー一覧

  • 住宅・不動産
  • マネー
  • 健康・医療
  • ビューティ
  • デジタル
  • 暮らし
  • 恋愛・結婚
  • ビジネス・学習
  • メンズスタイル
  • 旅行
  • 趣味
  • ファッション
  • グルメ
  • 車・バイク

ガイド関連

  • 専門家サーチ(ガイドを探す)
  • All Aboutガイド募集
  • ガイドへの仕事・取材依頼
  • 国民の決断

All Aboutサービス・メディア

  • All About ニュース
  • Best One
  • All About Japan
All About公式SNS
日々の生活や仕事を楽しむための情報を毎日お届けします。
公式SNS一覧
  • 会社概要
  • 採用情報
  • 投資家情報
  • 広告掲載
  • 利用規約
  • プライバシーポリシー
  • All Aboutについて
  • 著作権・商標・免責
  • 当サイトの情報についての注意
  • サイトマップ
  • ヘルプ
© All About, Inc. All rights reserved. 掲載の記事・写真・イラストなど、すべてのコンテンツの無断複写・転載・公衆送信等を禁じます