1 月 27, 2008
ThickBox から Lightview へ
Category : WordPress
つい先日、「LiteBox から ThickBox に変更」で書いたとおり ThicBox を導入したばかりなのですが、
早くも浮気して Lightview を導入してみちゃいました。
こちらも、画像のサイズによって自動でリサイズして表示してくれます。これはよい！そして Esc キーで閉じてくれます。
カスタマイズできる Lightview for WordPress at orioa を参考にさせていただきました。
ThickBox が jQuery を利用しているのに対し、Lightview は prototype.js を利用しています。
なにかと prototype.js がほかのプラグインなどで使われていることも多いので、そういった場合には ThickBox より導入しやすいかなと感じました。
prototype.js を使っているサイトで ThickBox を使う場合には競合が起きるので、
そのあたりを考えなくて良いように jQuery 利用サイトなら ThickBox、prototype.js 利用サイトなら Lightview を使うのも良いかもですね。
しかし、IE で見ると記事一覧ページで Lightview 動いてないな～、と気づきました。あれれ 
原因探してみます。
14 Comments, Comment or Ping
tomo
突然のコメント失礼します。
しかも私の環境はmacでsafariなので全然気づかずでした、、、。
私もWPでLightviewを使用してるのですが、IE6でとんでもナイ事になっているようで、困ってマス。。。
Numbさんは何か解決方法などは発見されましたか？
是非お力を借りたくコメントさせて頂きました。
突然のコメントの上、ぶしつけな要望をお許し下さい。
3 月 6th, 2008
inocco
tomo さん、はじめましてー。こんにちは。
私も少し調べてみたんですが、他に javascript を使っていたり、HTML が W3C 準拠でなかったり、ページへの CSS での指定が Lightview に影響してしまう場合などに表示が崩れるようです。
とんでもないこと、というのは表示が崩れてるということでしょうか？
あまりお力になれずスミマセンm(_ _ m
もしそうであれば、CSS がらみが一番怪しいかなと思います。
ただ私も IE ではきちんと動かしておらず、ページ移動になってしまっていたりします。
3 月 6th, 2008
tomo
Numbさん
なるほどぉ、、、そうですかぁ、、、
一般的には未だIE6ユーザーが多いので、thickboxならスムーズに動くと聞き、そっちに変えてみようかなぁって思ってマス。。。 
ちなみに「とんでもないこと」ってのは、どうもIE6でLightviewの画面を見るとエライ上の方に画像が表示されていて、スクロールしないと見えないらしいデス。一見真っ黒の画面のみに見えるとの事でした。 
という感じで、、、とほほデス。
ありがとうございました 
早速のお返事ありがとうございます
こちらでも、色々調べたのですが（友達に聞いてみたり、、とかとか）やはり解決策はナイんじゃないかと言われちまいました。
そして、thickboxのプラグインが送られて来た次第デス
Numbさんにはお調べ頂きホントに感謝しています。
これで心置きなくthickboxに変更する事が出来ます
3 月 6th, 2008
pe-san
はじめまして、つい1月ほど前にWordpressを使い始めた者なのですが、不躾ながらお知恵を貸して頂ければと思い、コメントさせていただきます。（AutoExternalLinkにはお世話になっております。）
FLASHや動画が使えるということで、lightviewを導入したいと思い、プラグインをサーバーにup&有効化し、ソースにrel=”lightview”と記述したのですが、何の反応もおきず困り果てております。
lightviewを知る前に、試験的に入れたlightbox2は（AutoExternalLinkのあいこが付いた状態でしたが)）キチンと動いたので、一連の手順に間違いは無いと思うのですが…。
プラグインの他に、なにか必要な物や作業などがあるのでしょうか？（本文中にある、prototype.jsを知らないので、これではないかと思ってはいるのですが…）
アドバイスをいただければ幸いです。
3 月 9th, 2008
pe-san
typoしてしまいました。
（AutoExternalLinkのあいこが付いた状態でしたが)）
↓
（AutoExternalLinkのアイコンが付いた状態でしたが)
失礼しました。
3 月 9th, 2008
pe-san
すいません、今日一日、色々試して駄目で、思い余ってコメントを投稿してから、もう自前のサイトのリンクをクリックしたら、なぜか突然動き始めました…
（何も変更していないのに！！！）
この直り方は、キャッシュが悪さをしていたのかと思うのですが、事前にキャッシュクリアや、ブラウザの再起動、閲覧するPCの再起動まで試したうえで、動かず悩んでいたのに…謎です…
。
連投までして、お騒がせしました。邪魔のようなら、コメントは削除していただいてかまいません。
3 月 9th, 2008
inocco
＞tomo さん
お返事遅くなってしまってスミマセン～；
thickbox も魅力的ですし、私も Lightview でうまく動かせていない部分もあるので、そのうち時間をみてまた thickbox に戻すかもしれません
prototype.js も jquery も便利ですが、共存させるのは結構手間なようなので thickbox にするなら他も色々検討しなくてはいけないなーと悩んでしまいます。
あまりお力になれませんでしたが、コメントいただけて私も参考になりました。
ありがとうございました！
3 月 11th, 2008
inocco
＞pe-san さん
はじめまして、こんにちは～。
お返事遅くなりましてスミマセン！
すでに自己解決なさっているようで、うまくいって良かったですね
その流れからいくとブラウザのキャッシュクリアがうまくいってなかったのでしょうか、うーん、不思議ですね 
AutoExternalLink も使ってくださってるようで、ありがとうございます
コメント連投はお気になさらないでください、全然大丈夫ですよ～。
お気遣いありがとうございます
3 月 11th, 2008
piro
Ligtviewを導入したのですが、Firefoxはデザインも崩れず、動作も問題ありませんでした。
しかし、IE6で確認したところ、画面のみブラックになり、肝心の画像が表示してくれません
http://test.jammu.jp/digitalsignage/japan/artist.html
http://okra.ark-web.jp/~komori/tkrb/lightview/01.html
上記のサイトはIE6でも正常に表示しているのですが
どうしてでしょうか？
3 月 18th, 2008
inocco
piro さん、初めましてこんにちはー。
IE6 では、画面が暗くなって「画像が表示されない」のではなく、「ページの上のほうに表示されてしまう」という状態ではないでしょうか？
もしそうだとすると私もその状態になって悩んでいました。
色々調べてみたところ、どうやらこの「IE6 で画像がページの上のほうに表示されてぱっと見た感じで画像がないように見える」という状態は、IE6 が互換モード表示になってしまった際に CSS の解釈が変わってくることが起因のようです。
私の場合、HTML ソースの一番最初、XML の宣言
[code]
< ?xml version="1.0" encoding="UTF-8" ?>
[/code]
を削除したところ、正常な動きになりました。
IE6 ではXML 宣言をすると互換モードになってしまうというバグがあります。これが原因で私の場合は表示が乱れていたので、piro さんも XML 宣言をしているようでしたら、これを削除することできちんと動くようになるかもしれません。
ちなみに、文字コードが UTF-8 の場合には、XML 宣言は削除しても Valid です
3 月 19th, 2008
piro
ありがとうございます！
inoccoさん
恐らくinoccoさんのご指摘どおりだと、私も思いました。
完全に解消されたかは判断つきませんが
問題なくIE6でやっと表示してくれました。
どうやらページのCSSに問題があったみたいなんですよ
bodyタグに
position: relative;を用いていたのを削除しましたところ
正常に表示してくれました。
でもホントにこれで良いのかは、まだ心配なんですけどね
私の制作したページは「shiftjis」ですが
最近、他のサイトを覗いてると、「UTF-8」が圧倒的に多く感じます。
こういった、Javascriptライブラリを使用するのであれば
「UTF-8」に変更したほうが無難でしょうか？
また質問して申し訳ありません
3 月 19th, 2008
inocco
piro さん、こんにちは～。
javascript を使用する場合に UTF-8 がよいというよりは、海外制の WordPress プラグインなどを使う場合に UTF-8 のほうが良いことが多いので、「これが使いたいけど文字コードが UTF-8 じゃないとうまく動かないな～」等あって UTF-8 にする方が多いのかもしれません。
また、XHTML を利用する場合には XML 宣言をする必要があるのですが、文字コードが UTF-8 であれば XML 宣言をしなくても Valid になることになっています。IE6 で XML 宣言があると互換モードというものになってしまい CSS の解釈が変わってしまうので、それを避けるために XML 宣言を除きたくて UTF-8 にする人もいるかもです。
基本的には好きな文字コードでかまわないと思いますよ～！
3 月 20th, 2008
Daiki
突然の書き込み失礼します。
現在Flashで作ったボタンを押すとLightviewが表示されるようにしたく毎日奮闘しておりますが、知識が少ない為、全く上手く行きません
作り方を知っている方いらっしゃいましたら教えて下さい
5 月 1st, 2008
inocco
お返事とても遅くなりすみません。
Flashで作ったボタンを利用する場合どうなるのか、といったことは私も経験がなく分からないのでお力になることができません。
申し訳ないです
5 月 21st, 2008
Reply to “ThickBox から Lightview へ”