« サイエンス大通りの宝島はだめぽ | メイン | テスト勉強中 »
2006年06月26日
Google Maps で Lightbox JS を使いたい
画像をクールに表示する Lightbox JS という便利なスクリプトがあるのですが、ちょっと制約があって困っています。
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
rel 属性を追加するだけで使用できるというシンプルな仕様なのですが、今回は、このシンプルな仕様がアダとなってしまいました。
Google Maps のふきだし内のリンクのように、リンクを JavaScript で生成している場合は、期待通りの動作が行われない。ページを読み込んだ後、リンクタグに rel 属性が付いているものに対して、下準備を行うからだ。
onclick="showLightbox(this); return false;"
ソースを斜め読みし、属性を追加する代わりに上記のように onClick を追加してみたのですが、いまいち上手く動かない。IE の場合は、最終的に Lightbox JS を使用しない場合と同じように表示されてしまう（return false; が効いていない？）。また、FireFox の場合は、半透明の背景画像が適用されない（背景画像がキャッシュされると大丈夫）。
どうやったら解決できるのかな？ソースを見ながら、使えるように移植するのがいいかなぁ。
【関連情報】
・Lightbox JS
http://www.huddletogether.com/projects/lightbox/
2006年06月26日 19:30 | Programming
トラックバック
このリストは、次のエントリーを参照しています: Google Maps で Lightbox JS を使いたい:
» KsGMap（Google Maps API） + Lightbox from TRANS
というのを実装してみた。サンプルは自分のサイトに設置しているが、まだコンテンツが不十分で、ネットで公開できないレベルなので、コードだけ説明しておく。ちなみに、... [続きを読む]
トラックバック時刻: 2006年08月27日 02:02
コメント
チャレンジしてみたいけど、余裕ないっす。
解決期待してます。
って、あり？テストは？
投稿者 おおにし : 2006年06月27日 01:27
かっこいいことを考えますねぇ。
画像をキャッシュさせるならbodyのonloadで以下のようなスクリプトを実行させればいいです。
preLoadImg = new Image();
preLoadImg.src = [ファイル名];
投稿者 あなくつ : 2006年06月27日 11:30
いつも読ませてもらってます。
↓ヒントになると思います。
http://slightlyblue.com/blog/2006/05/ajax_lightbox_js_v202_1.html
投稿者 slightlyblue : 2006年06月27日 12:47
>> おおにし さん
悟りを啓こうかと思います。
>> あなくつ さん
おー。他でも試してみます。
http://private.ceek.jp/archives/001919.html
>> slightlyblue さん
同じような感じでロードしてみたのですが、やっぱりダメ…。うーむ。
投稿者 ceekz : 2006年06月29日 11:26
おかしいですね。このサイトでは動いてますよ。それもほとんど全く一緒のコードで。
http://japonyol.net/lightbox.html
違うのはtitle="#"だけですかね。ほかのところとぶつかっている可能性もあるように思うのですが。
投稿者 arata : 2006年08月27日 01:22
>> arata さん
情報ありがとうございます。参考にさせていただきます。
前に試したときは、純粋に Google Maps だけを使っても上手くいかなかったのですが…。
投稿者 ceekz : 2006年08月27日 07:12