Binbo-Special－技術資料らしきもの－JavaScript－greyboxを試してみるでござる

世の中はどんどん複雑になっていくでござる

ニンニン

みなさん、いかがお過ごしですか？

何やら世の中には、画面遷移せずに（厳密に言うと画面遷移していないように見せて）、別のページとかを同ウィンドウ内に表示するようなものがいくつか存在するようです。

と言う訳で、拙者も実験してみるでござるよ！

greyboxを試してみるでござるよ

「graybox」は間違いだから気をつけましょう。
最初、情報を探している時に、思いっきりスペルミスしていて、中々情報が見つからなかった！！なんていうオマヌケな貴方（＋私）は気をつけましょう！

downloadはここから
http://orangoo.com/labs/GreyBox/Download/

英語が読める人は、本家から色々と情報を取得するでござる
http://orangoo.com/labs/GreyBox/

早速実験でござる

１．アーカイブを解凍した中にある、「greybox」を、ディレクトリごとどこかに置く

間違っても、好きなあの娘の引き出しの中にこっそり置いてはダメです。というより意味ないです。
無駄な火種は起こさない方が良いので、普通に自サイトのどこかに置きましょう

２．headに以下を追加する

パスは適宜変更してください。
GB_ROOT_DIRは、greyboxディレクトリへのパスです。

３．ナイススティックを2,3本食べる

４．「お前、バカにしているのか？」と上司から怒られる

５．リンク設定の<a>タグを、ちょっといじる

rel="gb_page_fs[]" を付けてあげれば良いみたいですね。

ちなみに、リンクが複数あって、グループ化させたいときは、
rel="gb_page_fs[nice_stick]" のような感じで複数指定してあげれば良いみたいです。ただ、個人的にはグループ化は使いづらいかなぁ、と思うので、使うとしても単発の方が良い気がします。

サンプルでごｚ

Binbo-Specialトップページとか
 加藤夏希オフィシャルブログ～Beauty Beauty～（何故？）

その他情報でｇ

細かく調べる気がゼロですが、「SyntaxHighlighter」とバッティングしましたので、一応メモ。
まあ、SyntaxHighlighterの呼び出し関連を先にすればOKOK

そして、greyboxは、ページ内に新しいdivを作成して、その中にiframeで該当ページを表示する、という方法が取られているようです。（lightwindowとほんのちょっとだけ違う。）
なので、lightwindowと違って確実に該当ページの内容が表示されるのがナイスなのですが、現時点ではiframeが故の問題点もあるようです。
ネットで色々調べたけど、結局情報にたどり着けなかったので、私なりにソース解析して動作検証したメモ書きをこちらに残しておきます。

lightwindowを試してみるでござるはこちら