Sun 15 Jan 2006
lightbox.js-ユーザビリティー向上？
Category: WordPress
You can leave a response, or trackback from your own site.
MMRTのMasayanさんがWP対応IImage-browserの日本語版をリリースしました。その記事中で紹介されていたのが“lightbox.js”というスクリプトです。
左の画像をクリックしてみてください。
同じページ上で拡大画像を表示できます。JavaScriptが無効になっている場合は通常通り新しいページに表示します。
基本的なインストール方法はMasayanさんの記事やOpenStratusを見ていただくとして、いくつか注意点があるので書いておきます。
- lightbox.jsの36行目、loading.gifのフルパスを入れる
- ファイル一式はカレントフォルダに新規フォルダを作り、まとめて入れる
上記の2について
./wp-content/uploads/以下にloading.gifを入れると上手く動いてくれませんでした。私の場合はカレントフォルダにlightboxというフォルダをつくり、lightbox.jsやCSS、画像などもまとめて入れてあります。
このスクリプトで直して欲しい所を一つあげるとすれば、表示用のdivの位置です。<body>のすぐあとではなくて、</body>の側などもっと下の方に表示するようにすれば、SEOやテキストブラウザにも影響が少ないですし良いと思うんですがいかがでしょう。
January 15th, 2006 at 10:45 pm
lightbox.jsもう随分前から挑戦しているんですが、出来ません
kairaさん成功してますねぇ。いままでやった物の中で一番難解です。なにか勘違いしているんだろうか？
January 15th, 2006 at 10:56 pm
こちらのyutakaさんのコメントを見ると、rel="lightbox"をimgタグに書いてしまっているようです。aタグの中に書いてみてください。
<a href="http://fish1091.com/wp2.0/wp-content/photos/
normal_banpaku07.JPG" rel="lightbox"><img src="http://fish1091.com/
wp2.0/wp-content/photos/_normal_banpaku07.JPG" /></a>
それでもダメなら、Firefoxで「表示->スタイルシート->スタイルシートを使用しない」に設定して試してみてください。それでも画像が表示されていなかったらjsファイルの読み込みがうまくいっていないんだと思います。
January 15th, 2006 at 11:17 pm
>aタグの中に書いてみてください。
これは前にも両方やってみたんですが、駄目だったんです。jsファイルの読み込みがうまくいっていないんですねぇ。う～～ん
January 16th, 2006 at 12:50 am
yutakaさんのサイトのコードを見てみました。
どうやらlightbox.jsのパスの指定があっていないようです。
<script type="text/javascript" src="http://jsファイルまでのパス/lightbox.js"></script>
というようにしてみてください。
January 16th, 2006 at 9:18 am
kairaさん、できました、できました。長い道のりでした。あ～～す～～～っとした。ありがとう
January 17th, 2006 at 12:12 pm
できましたか。良かったよかった