画像ポップアップスクリプトをLightboxみたく

category-icon

 ppBlogでは、もとより記事に貼り付けられた画像を元の大きさで表示する画像ポップアップというのを備えてましたが、近頃では、Web2.0に触発されてか、ThickBoxLink だの、LightboxLink だの、GreyBoxLink といった、画像表示に際して、ちょいとエフェクトを付けたりするのが流行のようで。

 なのでppBlogでも画像ポップアップをパワーアップさせました。かといって過剰な演出はあまり好きではないので、そんなに凝らずに、これだけは備えておきたいというものにしています。

0287026

 昨今のブロードバンドの普及に伴い、表示サイズの大きな写真を圧縮せずにそのままアップするケースも増えてきたように思います。結果、パソコンの解像度によっては、そんな画像を表示させるとブラウザからはみ出してしまうこともあります。なのでこのあたりを考慮して、ブラウザの枠からはみ出してしまうような大きなサイズの画像は2段階のポップアップとしました。まず、ブラウザ画面にフィットするような表示段階があって、で、さらに「実寸大アイコン」をクリックすると、元のブラウザからはみ出すような画像を表示させるというものです。

 具体的にアクションを見たほうが分かりやすいでしょう。なお、画像は、National GeographicのサイトLink にあったサイズが大きめの写真を拝借してます(1024x768ピクセル)。効果を確認するには、ブラウザのサイズを1024x768ピクセルより小さくしておいて下さい。このサイトには秀逸な写真がたくさんあって、個人的にお気に入りの写真は、スクリーンセイバー用にダウンロードしたりしてます。

LightHouse
うーん、いい写真だ。

 余談になりますが、このナショナルジオグラフィックの雑誌(日本語版もあります)には、新しく見つかった「ユダの福音書」の驚くべき解読結果のレポートが載っています。近々「ダ・ヴィンチ コード」の上映が始まりますし、何とも絶妙なタイミングですね。歴史とは、勝者が創り出す日記みたいなもんです。 →http://nng.nikkeibp.co.jp/nng/feature/0605/index.shtmlLink

 スタイルシートの話になりますが、Firefoxだと、写真のドロップシャドウが意図したように見事に実現されるのですが、IE6やIE7βでは、まだまだですね。IE7の正式版では、せめてこのドロップシャドウのCSSぐらいは出来るようになって欲しいもんです。


— posted by martin at 12:39 am   commentComment [22]  pingTrackBack [0]

T: Y: ALL: Online:
Created in 0.0035 sec.
prev
2006.5
next
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31