HOME > >

Lightbox JS

Lightboxとは？

画像をレイヤー表示のようにｶｯﾁｮよく開いてくれるスクリプト。チュートリアルとかに使うといいｶﾝｼﾞ。色々とバージョンがあってスライドショーにできるものやrel属性無しでもOKなものなど色々と出回ってます。

Lightbox JS

恐らくｺﾚが一番最初に世に出たもの？一番シンプルで使いやすいです。

lightbox JS サンプル

使い方

使い方はいたって簡単。javascriptファイルとcssファイルを読み込んで 表示画像へのリンクを作成。aタグに rel="lightbox"を追加するだけ。

HTML
  1.  
  2.  /* head 内でjavascriptファイルとCSSファイルの読み込み */
  3.  
  4.  <script type="text/javascript" src="lightbox.js"></script>
  5.  <link href="lightbox.css" rel="stylesheet" type="text/css" />
  6.  
  7.  /* aタグにrel="lightbox"属性の追加 */
  8.  
  9.  <a href="lightbox_01.jpg" rel="lightbox"><img src="lightbox_01.jpg" width="150" height="199" /></a>
Lightbox JS関連サイト

Lightbox JS v2.0

複数の画像をスライドショー形式で開くことができます。

参照サイト

MySQL全機能バイブル ~現場で役立つAtoZ~

作者:鈴木 啓修 | 価格:￥ 3,675

HTML5･JavaScript･CSS3アプリケーション開発入門 (日経BPパソコンベストムック)

作者:No Date | 価格:￥ 1,980

jQuery bgScroll
 ライブラリ
 Reflection.js
PAGE RANK

356 PV約 74 秒/1PV

Wordpress プラグイン作成前の基礎知識 | WEBプログラム覚書

1357 PV約 71 秒/1PV

[PHP]MySQLを利用した画像の保存と出力 | WEBプログラム覚書

265 PV約 69 秒/1PV

[jQuery Mobile]初期化イベントメモ | WEBプログラム覚書

538 PV約 64 秒/1PV

表示内容の切り替え(JavaScript) | WEBプログラム覚書

393 PV約 60 秒/1PV

[WordPress]XML-RPCを利用して外部から投稿したりする。 | WEBプログラム覚書

278 PV約 57 秒/1PV

[Ubuntu11.10]Ubuntuのインストール後の設定 | 情報備忘録

245 PV約 55 秒/1PV

[Ubuntu11.10]Windows XPとUbuntuのデュアルブート環境 | 情報備忘録

2343 PV約 50 秒/1PV

jQueryによる表示、非表示切り替え | WEBプログラム覚書

365 PV約 49 秒/1PV

[PHP] スクレイピング 基本 | WEBプログラム覚書

564 PV約 43 秒/1PV

javascript 子要素取得のメモ | WEBプログラム覚書

250 PV約 39 秒/1PV

ウィンドウサイズを取得 | WEBプログラム覚書

707 PV約 37 秒/1PV

[jQuery]こんな機能があったんだ。jQuery stop() | WEBプログラム覚書

217 PV約 32 秒/1PV

PHP 参照渡し(リファレンス)と値渡し | WEBプログラム覚書

868 PV約 28 秒/1PV

Dreamweaverで文字コードを変換する手順 | 情報備忘録

254 PV約 28 秒/1PV

[PHP]CakePHPのAuthメモ | WEBプログラム覚書

472 PV約 25 秒/1PV

ウェブデザイン・ホームページ制作 KANTENA.COM

214 PV約 25 秒/1PV

Divの高さを揃える方法 (css版) | WEBプログラム覚書

338 PV約 20 秒/1PV

MySQLエラー「Column 'カラム名' in field list is ambiguous」 | WEBプログラム覚書

217 PV約 18 秒/1PV

javascript フォーム関連オブジェクトの取得 | WEBプログラム覚書

635 PV約 17 秒/1PV

Excel VBA の改行コード | WEBプログラム覚書

TIME LINE
2012
05.16

XMLHttpRequestってUserAgentを変更できないのかorz

セキュリティ的に禁止してるんだろうけどChromeでは出来ないのか、そもそもJavascriptの仕様として禁止されてるのかは不明。

2012
05.10

[Javascript]文字列を1文字ごとタグで囲む

[PHP]文字列を1文字ごとタグで囲む | WEBプログラム覚書のJavascript版。

2012
05.10

[PHP]文字列を1文字ごとタグで囲む

PHPで文字列を1文字ごとタグで囲みたいとき。

2012
04.25

WebフォントとJavascript

WebフォントとjQueryのテキストエフェクトプラグインを試してて気がついたんだけど API経由でWebフォント取得、設定してるとJavascriptの実行が早すぎて困るw

2012
04.12

[Ubuntu11.10]インストール直後にやっておけばよかったこと

Ubuntu 11.10 Desktop 日本語 Remixの場合、ユーザーのホームディレクトリにあるディレクトリ名が 日本語なのでターミナルでディレクトリ移動する場合、非常に扱いづらい。

2012
04.11

シンプルでカスタマイズしやすそうなコンテンツスライダー jQuery Slider2

シンプルでカスタマイズしやすそうなコンテンツスライダー jQuery Slider2

2012
04.06

CORESERVERからロリポのチカッパプランに移転してFTPとおさらばした。

CakePHP2系はPHPのバージョンがシビアなので、CORESERVERからロリポの チカッパプランに移転したんだけど、gitが利用できてなんだか得した気分です。

2012
04.04

[CakePHP2.0.x]FormHelper::input()の出力メモ

FormHelper::input()の出力がどのくらい変更できるかのテスト。

2012
03.28

[CSS]WindowsでLESS更新時に自動でコンパイルする設定方法

Windowsで.lessファイル更新と同時にコンパイルしてCSSを書き出す方法を2つほど。 簡単に開発環境を構築するためUbuntu入れたのに、Windowsの方が簡単だったりするから困るw

2012
03.27

[CSS3/HTML5]ページタイトルとかに使えそうな3Dっぽいテキストエフェクト

Code Padよりタイトルとかに使えそうなテキストエフェクト。それほどゴテゴテしてなくていい感じ。